Skip to content 
UX Design
The Product
The Project
Research tools such as task and heuristic analysis were carried out to judge if there was enough scope for a valuable project. Additionally, the decision was made to study the website rather than mobile due to feasibility with user research.
From here field research was conducted in the form of both a questionnaire and usability tests to study the problem further. From the results of the research, four key problem statements were created which outline the user pain points, goals, problem solutions and other key metrics.
The Problem
The research phase highlighted many faults with the Pinterest website that need to be addressed. From these findings, problem scenarios were created to help summarise standout issues with the website. One scenario was chosen to be the reference point throughout the design phase. The problem scenario is as follows:
‘The current Pinterest website does not allow users to save an image to multiple boards at a time. This causes a lot of frustration for regular users who like to create multiple boards for similar topics.’
Along with this scenario, it was decided that other standout pain points would be studied to try and achieve ultimate usability satisfaction for the chosen persona. Three main pain points were highlighted that needed to be improved upon to fully enhance the user experience. These areas are:
– Website navigation.
– UI.
– Saving pins.
Once the problem areas were defined, the design phase of the project could begin where various web prototypes beginning with paper/low fidelity to digital/high fidelity could be created. These designs were trialled with test participants and amended with their feedback.
Design Research
Task analysis
Task analysis is the broad practice of the learning about how users work (i.e., the task they perform) to achieve their goals. It helps understand user goals, current steps and contextualise the influence of the physical environment. Below is an example of some of the tasks which were analysed using this process.
Login/Sign up
Pinning new user
Delete Board
Heuristic Analysis
Below is the heuristic analysis carried out on the Pinterest website.
Target Persona
Firstly, a proto persona was created as a secondary user of Pinterest. This persona was created from both early assumptions and desk research on Pinterest’s secondary demographic. The persona below mirrors a typical mother who is outside interests which require inspiration and creativity.
Then a primary persona was built from the results of the field research carried out. This persona showcases all the critical data found in the research which is a creative person who wants for a responsive, user friendly experience mood boarding platform that has a clean layout and easy to learn.
Key findings
Solution 1
Introduce mandatory fields for uploading new pins to encourage users to provide accurate information about the image source, necessary credit, etc.
This will help users in their research processes and create an enhanced and informed informational platform with a better overall user experience.
Solution 2
Redesign icons to more effectively communicate their function. Add text-based hover states that reinforce the function of icons and features to ensure users understand them. Improve user interactions so the website can be used more intuitively, ensuring it is clear when a usability goal has been achieved. Design improved page layouts with considered positioning of icons and other interactive features in relation to their function.
Solution 3
Design Decisions
Taking this into account, the following were key decisions made:
– Keeping the Pinterest brand colour scheme throughout which is red, white, black and grey.
– Have a clear hierarchy of selections.
(i) Primary selections – Search, Create New and User Profile.
(ii) Secondary selections – Messages, Notifications, Groups, Trending and Settings.
– The choice of font was Neue Haas Grotesk.
– Information would be broken into three vertical columns.
– Dropdown menus would be used for selecting multiples.
– A grey overlay of images would be used to minimise any chance of duplication.
– As highlighted in phase 1 that the target users would like more collaboration options, a group function would need to be designed.
WireFraming
Low/Mid Fidelity Wireframe
Paper prototypes allowed for rapid testing in the early stages of the design phase to quickly find ideas that work and those that needed to be eliminated
Once the page layout and functions were decided, these sketches were then transferred to digital to trial if these designs would transfer to a computer screen. Digital screens were created firstly as a wireframe to assess image sizing and spacing before adding the front-end details.
High Fidelity Wireframe
From here icon choices for each function were introduced and screens were populated with information. Brand colours were also introduced.
Information was the also broke into three vertical columns. The far left containing secondary options. The centre containing the primary information such as the search option and images. The far right then contains mainly empty space as referenced from competitors.
Usability Testing
Procedure
Due to the availability of participants, tests were carried out both locally and remotely. However, for both tests the surroundings were similar. Both were carried out in a typical home office space and took roughly 15 minutes to complete.
In terms of materials, when testing at home a simple print out of each screen was used while those doing it remotely were given access to an InVision prototype website created.
Questions and tasks were designed based on the key problems that were addressed in the rebuild. A total of ten screens were designed for subjects to navigate through. When making a selection, participants would either click or tap the button of choice and this would take them to the next screen.
Objectives
– Save a pin to multiple boards.
– Get user to identify each icon on the screen.
– Get the user to create a Pinterest group.
– Get the user to point out any dislikes they have about the page.
– Encouraged the user to provide any other information or feedback they may have.
Key Findings/Feedback
– Participants did prefer the cleaner more minimal layout of pages and liked the fact they were not overloaded with information.
– Bar the trending icon. Participants felt all buttons were understandable.
– Participants understood the need of a group page.
– In general, participants did find the process of completing tasks user friendly.
– Dropdown menus were clear and user friendly.
Dislikes:
– Menus require an exit button as undo process unclear.
– Positioning of functions within sidebar needed to be adjusted.
– Slight confusion between save image and create board options as both use a plus symbol.
