Back to Insights AUTHOR
Andy Wilby
DATE PUBLISHED
20.10.17

Lifting the lid on some of the typical UX design and evaluative research outcomes we create for clients

Following on from the first blog about our typical UX formative research outcomes we create for clients, here is the second part where we start to look at the UX design and evaluative research outcomes...

Sitemaps

Information architecture (otherwise known as IA) is a process to create the best possible site structure, before we start to sketch concepts. IA represents the building of foundations for any customer-centric experience.

The starting point when defining the IA is typically via a sitemap, showing a hierarchical level of all pages within the site (split into 'parent' and 'child'). This is where we also start to define labelling of each section & page, and highlight which should appear in the main navigation.

 

Card Sorting

As part of the IA sitemap creation for any application, website, or system that has a large number of pages and categories, card sorting is an extremely useful (and low-cost) approach in creating navigational menu structures to ensure users can quickly and efficiently locate content/pages via labelling and grouping only.

Card sorting, in it's rawest form, can be highlighted through post-it notes. As the structures become more defined then these initial navigational menu structures can be imported into relevant online software tools (such as Treejack) where they can be tested with users who are instructed to locate common pages within the proposed menu options. The outputs of this process are then finalised and reflected in the navigational menu structure within the wireframes and prototypes.

 

Wireframes & Prototyping

The wireframe stage is where we start to visualise in detail – typically based on any sketches – ideas and concepts of how the site will look in terms of structure, layout, functionality and interactions.

A wireframe never includes any specific visual elements (such as colour, style guidelines or being pixel perfect). Instead, wireframes should purely represent structures, hierarchies, functionality, interactions and sections through a greyscale style to minimise visual subjectiveness that could hamper progress. Although we don't worry about being pixel perfect, it's important to align to the same responsive grid layout that the visual team are going to utilise to ensure we present a true representation (creating a wireframe 800px wide to represent a common desktop view isn't a true representation if the actual visual design for a common desktop view is 1600px).

A prototype is similar to a wireframe, but the main difference is that a prototype includes many interactions on one page, whereas a wireframe only includes one. By introducing many interactions on one page, you get more of a detailed understanding of how a user will truly interact with the proposed experience. This means your feedback from users is more reliable.

Building a prototype is more time consuming then creating a wireframe because of the various dynamic panels that are used to display different interactions on the same page. This is why it's so important to utilise the sketching and wireframing for ideation so we can increase confidence of the prototype being positively received from relevant users during evaluative research. Rushing into prototyping too soon will result in wasted effort.

 

Pattern Library

A pattern library is a representation of all reusable common elements (and their varying states) that solve different problems, where we don't want to specifically create a complete wireframe page to showcase each of these. Each of these elements will provide a vision of the exact interaction in different scenarios.

We create a pattern library to introduce consistency and efficiency. It's that simple. The role of a UX designer is to understand the problem and create the best possible solution to solve this problem. We're not here to create over elaborate designs or waste time recreating one of many artefacts for no apparent gain.

 

Visual Designs

Once the wireframes / prototypes have been created and evaluated, the next stage would be to create visuals designs based on the UX work done to date. The clients we work with typically have their own internal visual design team. There are some exceptions, where we're required to create visual designs and align to any existing style guidelines or help shape their brand identify.

 

Evaluative research

We conduct many different types of evaluative research for our clients including; quantitative & qualitative feedback on proposed wireframes/prototypes, quantitative feedback on information architecture (IA), competitor reviews, expert reviews and heuristic reviews. Where we conduct quantitative feedback, we always look to embed a range of usability metrics so we can measure success.

The feedback we gather is documented to highlight any issues, the impact, any customer quotes, any video clips, any heatmaps, success metrics and a list of recommendations to improve/enhance the experience - this process is repeated rapidly to create an iterative design that ultimately meets the needs of the end-user. Create. Test. Learn. Repeat.

 

In summary

Whatever UX task is completed and any outcome defined, it's important to ensure this will have a real need and benefit to the product or service being created. The role of UX designer is to help the client deliver a successful project by representing the customer and creating a suitable experience that users want & need. We're not here to procrastinate over what something should look like or create something for the sake of it, we're here to get to the right outcome quickly & reliably, based on years of expertise.

Our engagements with clients vary, whether that be utilising our complete user experience and development expertise, or requesting a one-off piece of commissioned formative/evaluative research, or utilising a client's research findings and help them represent these needs into intuitive, engaging, innovative and relevant responsive concepts. We work with you to understand your business and digital ambitions so we can recommend how best to achieve these.

 

More UX blogs

Customer Journey VS User Journey

Proving success by defining benchmarks

The different ways to gather evaluative feedback

The role of a UX designer

Andy has been a UX professional for over 11 years, who has a great deal of experience helping shape usable experiences for HSBC, Aviva, Bupa, Co-op and Government agencies to name a few. Previous to joining Answer Digital, he was a Lead UX at Aviva for a 45-strong team of designers. His passion is working with clients to help solve complicated challenges and create something beautifully simple.

If you want to hear more about our UX research, design & evaluation services and expertise then contact our Principal UX Consultant, Andy Wilby, at andy.wilby@answerdigital.com or on 07595 878876.