Daniel Abbott UX Portfolio
UX Research and UX Design by London based Designer Daniel Abbott.
The user reads from left to right. Image first (using the arrows to scroll through views of the product), then copy. The hierarchy of elements enhance digestion of information. During development we introduced thumbnails for alternative views to increase engagement.
Showing an image thumbnail for search results was intended to help the user find what they are looking for but this became confusing when there were multiple views available for the products.
Using skip logic, the survey was successful in funnelling users through questions to find out the most frequent user journeys they were required to fulfil.
A balance of quantitative data and rich qualitative insights put me in a strong position to begin writing interview scripts to delve deeper into the behaviour of the users.
By installing Hotjar on the client's website, I was able to see that a content audit was required along with a re-evalution of the prominence of key interactions on the screen.
Screen recordings showed that some users were confused abut where the CPD logbook could be found. Responses from surveys and interviews reinforced that logging CPD was one of the top 3 actions that users needed to perform.
I conducted 10 user interviews with users fitting each of 4 key personas.
I wrote scripts based on survey data and concentrated on areas that caused frustration. I also shared ideas for new functionality according to the client's business goals which were well received and appeared to solve additional problems the users faced in their day to day work.
Each audience needed personal content to be surfaced. Students wanted to see exam results. Qualified bankers needed to see CPD logging options. The current homepage provided little interest to any audience.
The existing navigation shown above was in need of an overhaul. Some of the naming of sections was not in tune with what could be found in the sections.
I presented a new sitemap to the client who generally agreed with the approach and then through some collaborative tweaks we came up with a solid architecture that was ready to be tested on users. Before taking it out to users, staff from the client's office and our agency verified that it worked and some small amendments were made.
A significant problem that the new structure solved was that pages had been added over time and the simple page structure approach could not cope with the amount of content the site held. The introduction of a new Resource Library was proposed to solve this problem. Users would then be able to search for resources and filter to find the content that they want based on a user-centred taxonomy.
View the sitemap here
It was important to remain disciplined and spend time sketching before jumping into any wireframing software. I sketched multiple ideas and then began to verify the sketches by creating paper prototypes that I hostpotted using POP app.
I took to Sketch very quickly having already had years of experience using Adobe Illustrator and Photoshop. It was quick to mock up wireframes, create styles and symbols. I would later introduce the Sketch workflow at the agency that I was working for.
The protoype was a result of all the research, sketching, user journey mapping, content planning and wireframing that had been undertaken so far.
This iteration was tested at The Guardian user testing lab.
The user testing session was tough. The users were confused by the UI. It was much less conventional than I had thought.
Users were taking the onboarding aspect of the app very seriously and I had only mocked this up very quickly. I had to revisit this in much more detail.
The second iteration of the prototype included amendments to features and onboarding following the user testing session. I also began to apply UI design by adding fonts, colour, opacity and images to create a high fidelity prototype.