UX / UI Designer

NNT Uniforms Website


Visit NNT Website →

NNT supply corporate companies and the medical sector with team dress solutions. Due to a company rebrand, NNT where after a website redesign that incorporated the new branding, was simpler to navigate, increase online engagement and reduced the amount of garment returns.

My involvement was to conduct the necessary research and design the site structure and UI, so that the NNT internal development team could then build the site using the Magento CMS.

-- The Process

Discovery

Stakeholder interviews
User Interviews
Market Research

Analysis

Personas
User journeys
Competitor Review

Ideate

Information architecture
LoFi Wireframes
HiFi Wireframes

Design

Visual Design

Validate

Prototype

-- The Tools

NNT Unifroms Website Design

-- The Audience

NNT is B2B, selling to companies that are looking for branded and tailored staff wardrobes. The target decision maker ranges from company owners to managers, put in charge of finding a corporate or medical wardrobe solution.

Persona 1 Profile image Persona 1 Profile Persona 1 bio Persona 1 channels
Persona 2 Profile image Persona 2 Profile Persona 2 bio Persona 2 channels
Persona 3 Profile image Persona 3 Profile Persona 3 bio Persona 3 channels

-- Key Takeaways

Insight:

The target audience is extremely busy and want a user experience that's easy to use.

Opportunity:

Take guidance from commonly used e-commerce websites that do it best, so that the user experience is one that the audience is already familiar with.

Insight:

The audience is looking for a reliable and trustworthy company.

Opportunity:

Create a section on the site that highlights the NNT’s experience and services. Create long form articles to help promote their knowledge in their industry.

Insight:

Although talented in their field, the audience aren't fashionistas. Knowing what is in fashion and what will look good across their team can be quite daunting.

Opportunity:

Create lookbooks and highlight a personal stylist service. Allow users to put together a wardrobe and send to NNT team for their expert opinion.

Insight:

The target buyers are wanting garments look good on staff and last for a reasonable period of time.

Opportunity:

Create general guides section that houses information on product care, fitting guides and style tips. Include sizing information and care tips on each product page.

-- sitemap

After conducting stakeholder, user and competitor research, the user and company goals were established. At which point, a sitemap was created to reflect those needs and create a structure for the broad navigation and content of the site.

sitemap

-- site flow

In order to deliver a familiar user experience, the site flow and user journeys were inspired by many fashion ecommerce sites, which were adapted to the goals of NNT and the needs of the target users.

site flow

-- wireframes / prototype

With a lot of information housed on the site, making the content flow as simple as possible was a high priority. A clean layout was implemented to keep navigation easy to use and information easy to find.

Interact with Prototype

-- Designs

Following the new company brand guidelines, the designs took a minimalist approach, appealing to a corporate market, whilst maintaining a modern and fashion-centric look and feel.

NNT Homepage UI Design
NNT Product Page UI Design
NNT Lookbook Page UI Design

-- More Projects

Cadbury Favourites Fun & Games

Parks Victoria Website

Parks Victoria App

Victoria Big Build Web App

NNT Uniforms

Cachet Branding

NAB Fashionable Website

Nissan Spotto App

Bulmers Interactive Outdoor

Motiva Branding