Post Up Design Sprint
UI/UX Design | Summer 2020
Post Up is a new start up that wants to make it easier for remote workers to find a public place to work. In this 5-Day Google Ventures style Design Sprint, I set out to develop a prototype to provide design solutions for remote workers.
Role
UX/UI Design & Testing
Tools
Miro, Figma, Photoshop, Wistia
Design Sprint Constraints
Create for Mobile
Remote workers are on the go, so the product needs to be accessible anywhere.
Use Existing Spaces
The brand is only interested in listing existing locations like libraries, coffee shops and cafes.
Access by Monthly Fee
Users will find enough value in the design solution to opt-in to a low monthly fee for access.
DESIGN SPRINT | DAY ONE Mapping & User Story
I began to synthesize by taking notes and collecting information from recorded interviews with a target audience, looking for patterns and consistencies in their processes. I jotted down notes and sketches in my notebook, and created an affinity map from my notes to define the top needs and pain points.
Affinity Mapping
The interviews revealed similar goals and priorities with multiple cases of overlap between users; only a few select outliers landed in a miscellaneous category. These items are less of a priority, but will be considered throughout the design process. The map ultimately defined 4 main goals to include in the product.
Top Goals & Concerns
Wifi
Each participant reported that they need a good wifi signal to work and communicate. Further, if there is an hourly limit or purchase minimum, before they travel. Bonus if the wifi is free!
Crowd / Noise
Users prefer to gauge the crowd. How distracting will the atmosphere be? Will I run into a loud lunch rush? Wether users are working solo, or in meetings with clients and colleagues, avoiding crowds is a must.
Bathrooms
Most users are looking for a place to stay for many hours, and accessible bathrooms are an essential amenity to selecting a potential location to spend a long duration of time.
Space / Layout
Visualizing the space before walking in is a major component in the decision process. Users want to see photos, seating options, as well as outlets, lighting and communal spaces versus private breakout tables.
User Story
The user’s goals where assembled by priority, and pieced together to become a user story, following the user’s journey from end-to-end. The ultimate goal: find the ideal place that meets her criteria, and work remotely.
DAY ONE | WRAP UPPain Points from Users
“The photos that I see are usually of food, storefront, etc. I try to find photos of the interior to see seating options and the layout, but they can be hard to find.”
“Many of the sources I use, like Google Maps, are focused on food or restaurants, so I have to dig into the reviews to find information about wifi, bathrooms and noise levels.”
“As a self-employed person, I am often out between meetings with time to kill. Sometimes I am in parts of town I’m not familiar with, so I really don’t know where to go.”
“I get concerned that the space may not be conducive for a group meeting, Zoom call, or meeting clients because of space or noise.”
DESIGN SPRINT | DAY TWO Sketching
Diving right into ideation fueled by the user story, I quickly sketched 8 iterations of the Location Details screen noting a variety of ideas to meet the user’s needs. After sketching, I identified the most successful solutions (blue tags) and stitched them together to develop the product in more detail.
DAY TWO | WRAP UP
Winning Solutions
Photo Gallery
Focused on interior images, seating options, and atmospheric perspective to get a sense of the work space..
Ratings
Commentary from fellow users focusing on the location as a workspace, not as a restaurant.
Amenities
Including metrics on wifi permissions, bathroom access, capacity and parking options.
Recent Ratings
Featured reviews from fellow users, displaying first hand accounts in real-time.
Peak Hours
Hourly graph to display how busy the space may be throughout the day, and offer suggestions.
Floor Plan
Gives an overview of the interior space, table options, marks outlets and an overall sense of the space.
DESIGN SPRINT | DAY THREE
Decide & Develop
Each solution created in day two was stitched into the Location Detail page, and the story was defined from the user Home screen to the Arrival screen at the selected location. I decided to integrate the app to give walking, driving and transit directions, as well as prompt the user to rate their stay in order to perpetuate a robust community for other users.
Recalling the User Story
To test the alignment of the screen progression with the User Story, I detailed the User Story map to diagram each need in the and correlate those needs to the screen that offers that solution.
DAY THREE | WRAP UP
Addressing The User’s Top Goals
Wifi Access
Solution: Listed via “Features & Amenities” and displays key information like “purchase needed” “passcode with purchase” “free public access”.
Crowd / Noise
Solution: Through capacity metrics, interior photos, peak traffic graph and feedback from fellow workers, users can get a comprehensive impression of the environment.
Space / Layout
Solution: Browsing the photo gallery, and viewing the Floor Plan will give a healthy overview of the space, table sizes, community spaces, outlets and natural lighting.
Bathrooms
Solution: Listed via “Features & Amenities” noting details like code access permissions, as well as visually displayed in Floor Plans to view before arrival.
DESIGN SPRINT | DAY FOURPrototype
The prototype mapped out the User Flow, and with some extra time, I was able to make a List View screen to toggle away from the Map View if users prefer. All of the solutions were rendered in enough detail to be able to test and refine. Some features, like a menu snapshot to browse while walking to a location.
DAY FOUR | WRAP UPKey Interactions
Home features a large map for orientation. There is also an option to toggle to List View.
Explore or Search by City or ZIP Code.
Explore reveals a snapshot of each space within the location boundary.
Selecting a Pin from the map will open a drawer with a snapshot of the selection.
Location Detail pages touch on all major user needs including WiFi service, layout, crowd anticipation and other amenities.
Direction screens include a quick-view of the most popular menu items.
Rate prompts at the end of each trip.
* Travel animation during the directions phase of the video implies the user’s walking time to the destination.
Video made with Wistia
DESIGN SPRINT | DAY FIVE
Testing
Moderated testing sessions with 5 participants revealed some successful moments, as well as a few interactions to improve in Version Two. Testing the flow of the Red Route to find a public space to work remotely was the primary goal, while gauging the success of some design risks, like the popular menu items, were secondary.
Solving for Critical, Major and Minor Issues
For the sake of the Sprint, I decided to create design solutions for 3 issues that created the most trouble: Add a ride share option, improve the usability of the Floor Plan Feature and design the List View option. Version Two presents those improvements. In the same process, I improved the UI and overall fidelity of the prototype.
Design For Ride Share
Initially, the third travel option was a public transit option, however, users noted in unfamiliar places, they would have a hard time using local transit. Instead, it would be common to call Uber or Lyft to travel to a desired location.
Improve Floor Plan & Add a Key
Users hope to find a space with accessible outlets and bathrooms, in this feature, users can view seating options and note outlets before they walk in the door. If a user is meeting people, they can view how many tables have enough capacity to fit their group, and if the space is appropriate for their party.
*In this process, I also removed the featured rating overlay (seen in last image), revealing more of the interior photos and simplifying the overall design.
Integrate the List View
Panning around on a map can be useful, but others prefer to flip through images and compare appearances, instead. This carousel List View option allows the user to quickly compare stats like “free wifi” and “local favorite” with large scrollable images of the location’s interior.
The List View was updated in a “drawer” format rather than a toggle format to keep the two views tethered on screen, and improve the usability while moving back and forth between map and list view.
DAY FIVE | WRAP UPVersion Two
After creating quick design solutions to the top 3 usability issues, and changing some UI elements to increase the overall fidelity of the prototype, version two was complete.
What’s Next
After 5 days of work on the Post Up prototype, I considered what to target in subsequent tests, and how to improve the overall design.
In testing I found that users would prefer to be able to “reserve” a seat and be prepared before they arrive. This is challenging in this context because the structure of most of Post Up featured businesses are first come, first serve.
However, there is room for integration for restaurants and shops to include Post Up with their services; just like POS integration, reservation systems, GrubHub, Postmates or other external integrations. Post Up users would be able to mark a space on the floorplan within a time threshold and the locations could reserve Post Up seats for workers. This would be great marketing, but would require business buy-in.
More Projects
Ralli | Mobile Voter Guide
An end-to-end study and solution to help young voters vote.
WineSavour Virtual Shop
A full-stack UX/UI study built alongside wine lovers, for avid wine shoppers.