c_header

Crab Creative: Brand Refresh & Responsive Site UX strategy

The studio needed a brand refresh and UX overhaul, the current site wasn’t clear enough in explaining exactly what the studio specialised in.

A refreshed visual language was designed and a new UX strategy developed, focused on making the work the main feature and allowing a user to very quickly see the team’s area of expertise.

A system which loops the user’s experience, ensuring there is always something available to look at next.

You can see the Crab site here.

(Below) The previous Crab Creative homepage

c_old_hp

(Below) The updated Crab Creative homepage

c_new_hp

The aim of this refresh and new UX strategy was to make the services and expertise which Crab Creative offer really stand out, but at the same time, to let the work produced by Crab be the real attention grabber.

The first phase of the project was a working session where ideas for content hierarchy were discussed and quickly iterated in basic wireframe sketches. This approach allows you to see the full site and how pages and content will connect as a user flows through the website.

c_ux1

Once a content structure was agreed upon, the next stage was to define the site navigation and develop the user flow diagram further.

c_siteflow

Wireframes are then created to test the content hierarchy and ensure the user flow works as planned.

c_wireframe1
c_wireframe2
c_wireframe3

Sample pages are then designed and the UI brought to life. The visual language for the Crab site was designed to have strong CTAs but to allow the work to stand out more than the site furniture.

c_screen2
c_screen1

The end result is a modern, fully responsive site which guides a user through content, delivered in manageable amounts so as not to overwhelm or frustrate the viewer who just wants to understand what Crab Creative is all about and view their work.

You can see the Crab site here.

c_responsive

More projects

Concept. Design. Illustration
Concept. Storyboarding. Matte Paint. Sculpture
UX Strategy. Rebrand. UI Design
Concept. UI Design. 3D Modelling & Printing
Concept. Illustration. UI Design
Social Content Strategy. Design
Content Strategy. Design
UX Strategy. E-Commerce
Social Content Strategy. Video. Papercraft
UX Strategy. E-Commerce