Group client project - Frontend Mentor | Statistics dashboard and rework of existing site
PROCESSES
Project canvas | Competitive analysis | Surveys | 1-1 interviews | Experience maps | User flows | Personas | JTBD & scenarios | Usability tests | Paper prototypes | Mid-fi to hi-fi wireframes | Design system
Business Goals Met
Validate, separate and promote member features vs non-member
Promote sign ups to community - Slack etc
Promote interaction between users
Distinguish monetisable approach to challenges
BRIEF
Design the flow for a dashboard that will display a statistical breakdown to provide the user with in response to their code solutions. Integrate this into the existing site using the provided design system and test and iterate the full flow of the site. Additionally, implement a monetisable member structure and social aspect to the site.
OVERVIEW
Frontend Mentor is an interesting new approach tutorial sites for developers. It stands out as a community-driven site that presents creative challenges for users to hone their coding skills. After submitting a solution, the user benefits from direct expert feedback from the platform creator as well as other established developers. The client had already developed a great, live MVP waiting for additional features and depth to be added; this is where my team and I come in.
OUTCOME
In a team of 3 UX designers over a 3 week period, we managed to meet the brief and considerations, while also responding to user needs and business goals. The process consisted of an extensive research period with real world users and developers, followed by testing on 5 stages of prototypes that progressed in increasing levels of fidelity up to a Hi-fi prototype. We developed the dashboard in order to provide an intuitive automated report along with iterating the entire existing flow. As well as this, we approached it appropriately both for desktop and mobile usage. In addition, we included prompts towards premium member feature as well as determining the separation between member and non-member content. Throughout, we stuck to our key objectives of developing the community, data visualisation and usability.
LESSONS LEARNED
Client communication and working to a complex real world brief
Collaborative work and organic implementation of appropriate UX processes
Data visualisation, affinity mapping and information architecture
In-depth knowledge of front end code statistics
UX research processes - screener surveys, user interviews, contextual inquiry and extensive competitive analysis
Usability testing
Hi-fi prototyping and implementation of consistent design system
Working to business metrics - Promotion, sharing capabilities, separation of member and non-member features
Sketch and InVision
Presentation skills