NITEOUT
A mobile app that is the easiest way to find fun things to do with your friends on a Friday night. It leverages 3D spaces to disrupt the online social media environment and bring the night-out experience home in a more immersive and fun way. Our goal is to let you casually meet and connect with new people. I worked on this project for a startup, helping them take their general idea into a complete app that we are currently launching.
Duration
5 months
Main skills
- 3D mobile app UX
- User persona
- User journey map
- Wireframing
- Figma
- Surface design
- Custom icons
- User testing
My contribution
- Translated app idea to a clickable prototype
- Primary UX/UI designer
- Conducted user tests
- Collaborated with owners, 3D artists, and engineers.
- Created MVP design
Worked with
- CEO/Founder
- Backend Software Developers
- Frontend Software Developers
- 3D artists
- Designers
- Logo Designer
​
Challenge
After a long day of hard work, do you get home and wonder how you can make the best use of your free time? Our goal at NiteOut is to give you an easier way to find fun things to do with your friends or to help you casually meet new people to best spend your downtime.
​
We want to help you answer questions like -
Persona
Discussing our goals with the rest of the team, I created our persona. We want our product to cater to both real life outings and to bring night out experience home so it can be enjoyed remotely.
During our initial launch, we want to target people like Lexi since they are more likely to be early adopters and bring their friends and followers onto the platform.
User Journey Map
Putting together information from surveys, I created this in order to identify pain points in our user's experience. Based on our research, it looks like having an app dedicated to finding the most happening event tonight and leveraging the information of where your acquaintances are will be useful to our users and allow them to relax and enjoy their Friday night.
Structure
After analyzing the features offered by several apps that offer functionality we wanted to include, we came up with a prioritized features list and structure for our app. I looked at several social media, dating, 3d social games, event planning, booking, food delivery, music, and even dress-up game mobile apps.
The main features are feed, explore, virtual bar, profile, chat, create new post, and dressing room.
Wireframes
I did several rounds of sketching using procreate before moving into Figma. We explored several different layouts for each page and experimented with different form of navigation between pages.You can try out Figma here.
User Testing
I started using the wireframes and more refined prototypes (you can try out one here) in order to collect user feedback on the features and final design. Here are some insights from the testing that helped me simplify and refine the prototype.
​
Based on the feedback and engineering constraints, we decided to build out only the virtual bar spaces for the initial launch. We felt that, while users preferred the real features, we needed to explore the potential that the virtual spaces had.
Surface design
I created a final color palette, text library, buttons, and placeholder logo and icons as we moved towards the final design. Since we expect the app to be used primarily at night or in dark places, we went with a default dark theme.
Final screens
We temporarily removed several features from the app, focusing those we needed to understand how users will interact in the virtual bar experience. In the current design, we expect you to primarily click on a link we email you or that you find on social media to enter the virtual bar for special events. This allows us to encourage users to be on the app at the same time and to try out different activities.
Final walkthrough
I created the final screens for the app using Figma. You can try it out here.
​
I am currently working on making in between screens, handing off the final design to engineering, and refining other features.
