City Guide Mobile App
UX/UI DESIGN | iOS MOBILE APP
A mobile application that allows people to explore their city in a new way; find new things to do; explore cool activities; indulge in new restaurants and stay in the loop with the most trending spots to go for a drink.
🔹 Summary 🔹 Problem Statement 🔹 Outcome
_________________________________
Summary
___
This project was developed during a design sprint with a 2-day submission deadline. I served as sole designer responsible for branding, interface concept, ideation, mock-ups, and presentation. To begin solving the design problem, I had to quickly research on local tourism, referencing the digital platforms already available, and identifying strengths and weaknesses to uncover improvement opportunities.
Tools used: Figma, Mock Flow, Canva, pen and paper
Main Screens
Background
___
For this project I had the limited time capacity to research wide. I ambitiously decided to tackle the design challenge using the Double Diamond strategy, noting the agile aspect of the strategy, to deliver a sensible product in a short space of time. The goal of the challenge was to see how effective design principles are applied; how user goals are translated to the design, with little to no time for iteration of the design solution.
The Challenge
My name is Client and I want to create an app that allows people to explore their city in a new way. I want to be able to find new things to do, explore cool activities, indulge in new restaurants, and stay in the loop with the most trending spots to go for a drink.
The Goal
The goal is to create a platform that not only provides users with a curated experience when searching for things to do but also provides creators the opportunity to get paid for finding, documenting, and creating content for the app. I want to focus on video content and make sure the app is engaging.
_________________________________
Design Process
___
Strategy
Illustration credit to @bryanmmathers
Research Discoveries
Secondary research, under the discovery phase, was performed on competitors' products, reviews and other mainstream city guide and travel platforms. This provided insights on the common frustrations, happy paths and pain points experienced by users. I synthesized this information and used the results for divergent thinking, to come up with draft solutions to the problem.
Primary Research
As the festive season is edging closer, many people start to plan for holiday. I was able to consult with people around me on how they were going to find the perfect holiday getaway for their families. After observing their experiences with different platforms, I gathered the observations, synthesized the data and identified insights, including pain points. Majority of the frustrations had to do with an unsatisfying search process, which often comes with a bombardment of recommendations.
Competitive Analysis
I also performed a quick audit of city guide companies' products. I focused the audit on the user flow and visual design of the applications. This was helpful in identifying what features existed and why. I then wrote down features I had identified to be useful, usable, enjoyable and equitable, and I combined them to help identify unexploited opportunities. After completion, I realized gaps, weaknesses and improvement opportunities to take advantage of.
Competitors
Insights
From the audit, the application would need to be simple, clean and yet engaging. Below is a screenshot of popular review topics of a competitor's product, from Google Play Store. I also perused through a few comments, both positive and negative, under these topics, for more opportunities.
_________________________________
Defining the problem
5 Ws and H Framework
Reason: I also used this framework to fully expound the core problem; establish goals; understand constraints; define deliverables; and create a benchmark for success.
🔹 Who: A busy construction manager
🔹 What: Joshua wants to explore new spots for weekend getaways and outdoor activities.
🔹 Where: Joshua is likely using the app at home and at work, on the go.
🔹 When: Joshua gets frustrated when he opens the app, starting from the very beginning of the user journey.
🔹 Why: Joshua doesn’t have a lot of experience with city guide apps or similar platforms.
🔹 How: Joshua wants to go easily from the home screen of the app to the list of nearby getaways to the booking screen.
🔹 What: Joshua wants to explore new spots for weekend getaways and outdoor activities.
🔹 Where: Joshua is likely using the app at home and at work, on the go.
🔹 When: Joshua gets frustrated when he opens the app, starting from the very beginning of the user journey.
🔹 Why: Joshua doesn’t have a lot of experience with city guide apps or similar platforms.
🔹 How: Joshua wants to go easily from the home screen of the app to the list of nearby getaways to the booking screen.
_________________________________
Development
How Might We?
How might we utilize insights from research to create an easy, efficient, relevant, and all-round pleasant experience for the user, to explore their city with ease.
From the define stage, I used the 'How might we' question, that I formulated, to sketch the ideas of the homepage.
Goal: Rapidly generate ideas applying innovative thinking, to come up with the best idea.
From the wireframe sketches, I was able to collate the different design aspects that were crucial to solving the challenge, problem statement, and the 'How Might We' question effectively. That includes the 6 aspects noted above.
Main Features
Explore
This is an example of a screen that the user will see after searching for their city. It includes a sliding navigation with several items to explore. This ranges from bars and clubs, events, outdoor activities, etc.
The next feature is a search bar, which allow a user to search within a city for any place, activity or item familiar to them. It's strategically positioned on the screen, leaving more space for a background image of the city.
And lastly, when the user scrolls down they'll see interactive cards of recommendations neatly stacked evenly. These fall within clearly marked categories which allow horizontal scrolling as well.
Discover
The user can go directly from the homepage to the discover screen. The screen has several features including a scrollable nav bar with clearly marked items to explore.
The purpose of this screen is to intelligently gather and show similar searched items that are in the same radius of the user's location, without exerting several of its own recommendations to the user.
Clean and beautiful illustrations were used on the scrollable items that are neatly recommended to the user. This mainly comes under the title 'popular'. As opposed to commonly used images, illustrations are neat and allow more white space on the screen.
Activities
For example, when you are on the 'Discover' screen and you press 'Popular Activities', you'll smoothly get to this screen. It will intuitively show you popular activities nearby, with a filter that neatly allow you to add desired parameters.
What is mostly unique is the way the items are neatly and evenly stacked together. This allows the user easy navigation and comprehension of the different types of activities, as opposed to the tiny pictures and clutter of text on our competitors' product screens which increase complexity.
Below is a link to the prototype:
_________________________________
Conclusion
___
Take-aways
___
▪ The most vital lesson I learnt during this design sprint was how to design within a torrent of constraints.
▪ This includes unravelling a user flow that has been made unnecessarily complex by most competitors and deliver a simple yet sensible user flow that fulfils the purpose of the user.
▪ Another important lesson I learnt is rapid design. To be able to unravel the challenge, define it, come up with a sensible solution and deliver it, all within a specified miniscule timeframe was extremely challenging but rewarding.
▪ To take this project further, I would add the creators' feature and screens. This would include the ability to add real time media to a forum as recommendations, in a simple and engaging way.
____________________________________________________________________
Thanks for viewing!
⁕ ⁕ ⁕