Strangely.ai

Building a clearer digital presence for an independent digital product studio

WordPress · UX/UI Design · Content Strategy · Service Design · Applied AI

Strangely.ai is an independent digital product studio combining ecommerce, UX, search, content and applied AI. The project transformed an early portfolio-led concept into a focused business website with clearer positioning, a restrained visual identity and a straightforward route from service discovery to enquiry.

Project overview

The website needed to present Strangely.ai as a credible business rather than another personal portfolio or conventional digital agency.

The studio’s services span several connected disciplines: ecommerce, UX and digital products, SEO and content, and applied AI. The main design challenge was to communicate that breadth without making the website feel complicated, fragmented or overloaded with technical language.

I led the project from positioning and information architecture through to page content, visual design, WordPress implementation and the move to the strangely.ai domain.

The resulting website uses a minimal four-page structure—Home, About, Services and Contact—supported by concise copy, cool neutral colours, generous spacing and direct calls to action.

1. Problem statement

The original direction mixed personal-portfolio language with agency-style service promotion. Early visual concepts also used strong yellow, pink and black combinations that created impact but competed with the content and made the site feel less considered.

Three problems needed to be addressed:

• The range of services felt like a list of unrelated capabilities.

• The visual identity was louder than the intended positioning.

• Visitors needed a faster way to understand what Strangely.ai does, how it works and whether it could help them.

The business needed a website that could explain a multidisciplinary offer in plain language while maintaining enough flexibility for new services and case studies to be added later.

The central design question became:

How might Strangely.ai present a broad mix of digital capabilities as one coherent, practical service?

2. Research and insights

This was a self-initiated business project, so the research phase was deliberately lightweight and practical. It combined:

• An audit of the existing portfolio positioning

• Review of competing consultancy and digital-studio websites

• Comparison of several WordPress themes and page structures

• A content inventory covering services, audiences and project types

• Iterative visual review through desktop screenshots

• Responsive and live-browser checks during implementation

The review produced several useful insights.

Clarity mattered more than creative impact

The most visually aggressive concepts stood out, but they distracted from the service proposition. A quieter layout made the work feel more credible and allowed the content to lead.

The services needed a shared narrative

Ecommerce, UX, search, content and AI could easily appear disconnected. Presenting them as connected ways to solve practical digital problems created a stronger overall proposition.

Outcomes were more useful than tools

Headings based only on Shopify, SEO or AI explained the capabilities but not their value. The revised language focused on clearer products, better journeys, stronger visibility and more effective ways of working.

The site did not need a complex structure

A small number of well-defined pages provided enough depth for the initial launch. Additional case studies and insights could be introduced later without changing the core navigation.

3. Define and ideate

The positioning was distilled into a concise central statement:

Clearer digital products. Smarter ways of working.

This line gave the website a broader purpose than simply selling individual technical services.

The offer was organised into four connected areas:

1. Ecommerce & Shopify

   Improving store structure, product discovery and the journey from browsing to buying.

   
   

2. UX & digital products

   Researching user needs and designing clearer websites, journeys and digital tools.

   
   

3. SEO & content

   Strengthening visibility through better structure, useful content and clearer search signals.

   
   

4. Applied AI & automation

   Using AI, research and data to simplify repeatable work and support better decisions.

   
   

Early concepts explored bold colour, oversized typography and more promotional language. These were gradually simplified in favour of an editorial layout, restrained typography and outcome-led copy.

4. Information architecture and wireframes

The information architecture was intentionally compact:

Home

• Positioning and value proposition

• Four connected services

• Approach

• Project enquiry call to action

About

• Studio positioning

• Working principles

• Practical outputs

• Contact route

Services

• Service overview

• Ecommerce and Shopify

• UX and digital products

• Search and content

• Applied AI and automation

• Combined-service enquiry

Contact

• Short introduction

• Enquiry form

• Email contact

• Privacy consent

The homepage was designed as a clear sequence:

Positioning → capabilities → approach → next step

The desktop layout uses wide margins and a split hero. Mobile layouts collapse the content into a single reading order while keeping the primary message and calls to action near the top.

5. Prototype and interaction

The website was implemented in WordPress using reusable page sections and a consistent design system.

The interaction model was deliberately simple:

• Persistent primary navigation

• Clear page-level headings

• Direct links from service summaries to deeper content

• Primary and secondary hero actions

• Repeated project-enquiry calls to action

• A short contact form with visible labels and privacy information

• Responsive image and text arrangements

Buttons were written as explicit actions—such as Explore services, Start a project and Start a conversation—rather than generic labels.

The limited interaction model was a conscious decision. The website needed to feel efficient and dependable, without animation or interface effects distracting from the content.

6. Usability testing and feedback

The initial release was reviewed through iterative heuristic checks rather than a formal participant study.

The review focused on whether a visitor could:

• Understand the business proposition from the hero

• Identify the four principal service areas

• Understand how the services connect

• Find more detailed service information

• Reach the contact form without unnecessary steps

• Use the website at desktop and mobile widths

The most significant issue was positioning. Early wording described the available services but did not clearly express the overall value of the studio.

Visual reviews also showed that the original high-contrast colour direction made the page feel busier and less professional than intended. The cooler, neutral design system created a stronger relationship between the layout, content and studio positioning.

Formal usability testing has not yet been completed. This is recognised as a limitation and forms part of the next phase.

7. Iteration and design decisions

Several substantial changes were made during the project.

From service list to value proposition

Before:

“Shopify, web design, SEO and content, working together.”

After:

“Clearer digital products. Smarter ways of working.”

The revised version communicates an outcome while allowing the service offer to expand.

From bold promotion to restrained confidence

The initial yellow, pink and black direction was replaced with a palette built around silvery white, midnight blue, slate and cool grey.

This gave the site a calmer and more credible visual tone.

From generic agency language to direct communication

Phrases such as “revolutionise your business” were removed. The final copy uses practical language and avoids exaggerated promises.

From four isolated services to one connected offer

The service architecture was revised so each capability could stand alone while also supporting wider, multidisciplinary projects.

From template content to purposeful calls to action

Placeholder contact details, generic newsletter language and vague buttons were identified for removal or replacement. Calls to action now describe the intended next step clearly.

8. Final high-fidelity designs

The final design uses a minimal visual system:

• Primary background: soft silver-white

• Primary text: midnight navy

• Secondary surfaces: pale blue-grey

• Actions and panels: slate blue

• Supporting tones: cool grey and white

• Typography: clean sans-serif type with a restrained hierarchy

• Imagery: muted digital-workspace and process-led photography

• Layout: wide margins, rounded image corners and generous spacing

Accessibility considerations included:

• Strong contrast between primary text and backgrounds

• Visible form labels rather than placeholder-only fields

• Descriptive button labels

• Large, readable headings

• Clear keyboard-sized interaction targets

• No important text placed over photography

• A simple and predictable navigation structure

The design was intentionally kept modular. New case studies, service details and insight articles can be introduced without rebuilding the core website.

9. Impact and reflection

The project produced a live, responsive business website with:

• A clearer studio proposition

• Four connected and understandable service areas

• Consistent content across the Home, About, Services and Contact pages

• A restrained visual identity suited to professional services

• A direct route from discovery to enquiry

• A reusable WordPress content structure

• A completed migration to the strangely.ai domain

• Working HTTPS access through both the root and www addresses

The project does not yet have enough live traffic or enquiry data to support commercial performance claims. Its immediate impact is therefore qualitative: the business now has a coherent digital foundation that explains what it does and provides room to grow.

The most important lesson was that simplification is an active design decision. The strongest result came from removing competing ideas, reducing visual noise and making every section perform one clear job.

Next steps

The next phase would include:

• Formal usability testing with representative business owners

• A full accessibility review

• Search metadata and structured-data refinement

• Analytics and enquiry-event tracking

• Additional portfolio case studies

• Form-delivery and error-state testing

• Replacing any remaining temporary imagery or contact details

• Measuring which services and calls to action attract the most engagement

Strangely.ai now provides a focused starting point: clear enough to launch, flexible enough to develop and practical enough to support the business as its offer evolves.