nibblenav
UI DESIGN | UX DESIGN | USER RESEARCH | USABILITY TESTING
Overview
As someone that doesn’t use most social media apps, I found a problem finding food trucks in my local area. I set out to create an app that was easy to use and provided all of the info that I was searching for.
My Role
Sole UI/UX Designer
Duration
Initially 65 days. Ongoing iterations
Tools
Figma, Adobe XD, Excel, Paper & Pencil
Design Process
Inspiration
I started the inspiration stage by conducting market research and competitor analysis so I could better understand who my competitors were and what they did well and where I could find improvements.
Problem Statement & Solution
My research revealed that there weren’t any well known or direct competitors that had apps or sites catering to the user. This told me that the potential for nibblenav being useful for people was good. The fact that I couldn’t find a larger system that targeted the user posed a few questions (i.e. Why wasn’t there one app and site that was the ultimate useful tool for people wanting to find food trucks and order in advance?). Because I had plenty of time to dedicate to it, and only a minimal amount of money to lose, I decided to create the app and see what I could accomplish.
My findings helped me shape my problem statement and possible solutions. My problem statement has remained consistent throughout the app’s development, however the solutions have changed as the project has progressed.
User Interviews
I conducted user interviews remotely and in person to gain a better understanding of my users’ needs, goals, and pain points. I asked questions that focused on users’ experiences with food trucks and searching for them when wanted. Then I analyzed my users’ answers by sorting them into an affinity map to gain overarching insights.
Conceptualization
Using my findings from the inspiration phase, I created user personas to represent users with different backgrounds and needs.
Wireframes
I started sketching Lo-Fi wireframes with pen and paper. I moved on to Adobe XD for my Hi-Fi wireframes. Continuous iterations were made to improve the app’s functionality and UX
Iteration
As a first step in the iteration phase, I used Figma to create a clickable prototype.
Style Guide
I used actual images of the trucks and menus to help users feel more engaged.
Colors
The app’s main colors were Coral and White. The Atoll and Revolver colors were used for text and call-to-actions.
Typography
For the typography, I used Caprasimo and Inter.
Icons
I kept the icons simple and solid-filled.
Final Reflections
This was agreat learning experience and a crash course in user research and testing. I will definitely be placing more focus on those aspects to better my end results in the future.
Want to work together?
If you like what you see and want to work together, get in touch!
danny@dannyduff.com