Workery
An online marketplace to find your next workspace.
Role: Product Designer
Background
Workery is an online marketplace designed to connect freelancers, entrepreneurs, and start-ups to on demand and long term office spaces. The focus will be creating a new logo, brand, and identity as well as creating a responsive website that involves search, filtering, booking, and scheduling.
Problem Statement
How might we make finding a new office space easier for users?
Audience & Users
Individuals or companies searching for long term or short term office space.
Process Overview
Conducting Research
Competitive Analysis, User Interviews
TIMELINE: ONE WEEK
Competitive analysis was conducted by first looking at direct and indirect competitors. Strengths and weaknesses were assessed, both on a functional level as well as the UI design.
Individual interviews were conducted with users that had recently secured or were currently searching for long term or short term office space.
Competitive Analysis Findings
- Strengths
- Many different types of spaces available
- Extensive filtering
- Map view
- Realtime availability
- Live chat
- Save search
- Cool tone color palette
- Vivid photography
- Consistent modern UI
- Weaknesses
- Confusing navigation
- Cannot hide map
- No option to hide listings already viewed
- Low contrast on text
- Multiple sticky headers don’t leave much space to view search results
- Strengths
- Search hourly, daily, or monthly
- Clean card layout
- Reviews available
- Map with pin preview
- Social login
- Realtime availability
- Clean minimalist design
- Neutral color palette
- Weaknesses
- No option to hide listings already viewed
- No back to top
- Can’t hide map
- No live chat
- No thumbnail previews
- Strengths
- Option to toggle map
- Save search
- Ratings available
- Sort by price
- Extensive filtering
- Live chat available
- Clean minimalist design
- Neutral color palette
- Weaknesses
- Limited to a handful of major cities
- No option to hide listings already viewed
- Inconsistent grid and margins
User Interview Findings
Each interview was insightful and some offered information that would be helpful in the overall research process. 75% of participants identified as male and 25% identified as female between the ages of 36 – 47.
- Pain Points
- Overall frustrations with customer service
- Loud common areas at shared workspaces
- Working from home lacks human interaction
- Commercial buildings were much more archaic in the process of booking a tour
- Commercial buildings need a lot more hands on work to set up the offices than a move in ready space
- Delights
- 24/7 access with no strings attached
- Good work culture
- Clearly listed parking availability
- Co-working is great for networking
- Move in ready spaces made the process of moving the team simple
Define
User Persona, Empathy Map, Problem Statement, User Flow
TIMELINE: ONE WEEK
After research was conducted, we moved into synthesizing our findings. A user persona and empathy map was created to help tell the user’s story.
The user persona was created based on the user interviews and surveys that were conducted. Our objective was to explore a persona that would best represent a typical user of this type of marketplace. The information heard and key findings from our interviews and surveys was used to craft our persona.
The empathy map further explored our persona’s thoughts, feelings, actions, pains, and gains. We used direct quotes gathered from the interviews, and noted actions that our users described to us as typical behavior and reasons for using this type of service
Once we understood the user, we were able to define the problem we were trying to solve. Our problem statement was crafted through understanding of our user and our research.
Our user flow was crafted to establish a baseline of how our user would book a tour or book an on demand space using this product.
User Persona
Empathy Map
- Hearing
- User reviews
- Conversations at work about improving collaboration and creativity
- Business podcasts
- Thinking & Feeling
- “What will appeal to my team?”
- “Can I find something within budget?”
- “I don’t want this to be time consuming.”
- Excited
- Overwhelmed
- Seeing
- Retargeting ads from visited sites
- E-mail newsletters for business managers
- Employees working in shared offices
- Doing
- Compares prices
- Visits multiple websites, multiple times
- Creates lists
- Discusses with colleagues
- Reads relevant articles
- Pains
- Budget constraints
- Time constraints
- Gains
- Better communication between employees
- Better collaboration and creativity
- Improved moral
- Room to grow
Problem Statement
How might we make finding a new office space easier for users?
User Flow
Design
Low Fidelity Wireframes, Logo Design, Style Tile, UI Design, UI Kit
TIMELINE: ONE WEEK
After defining, we moved into design. Wireframes were built out in Sketch, and prototypes were built on Invision to help map out the user flow, as well as provide a starting point for our usability testing.
After wireframing and prototyping we moved into branding and identity. This included logo design, typography choice, photography style, and color palette.
The key adjectives established for the Workery brand: Community, Innovation, Creativity, and Collaboration.
The logo design features a modern look and feel with a cityscape skyline icon.
The color palette created incorporated cooler tones with a pop of warmer accents.
Wireframes
Logo Design
Style Tile
UI Design
UI Kit
Test
High Fidelity Prototype, Usability Testing, Affinity Map, Priority Revisions
TIMELINE: ONE WEEK
A high fidelity prototype was built on Invision using our UI design. We conducted usability testing in person, remote via Skype, and remote via maze.design
Some of the findings from our usability testing indicated some of the users were a bit confused as to where to click to enter a single item listing. Another common finding was that some of buttons and form field inputs were not easily distinguishable between disabled, active, and hovered states.
We used our findings from the usability testing to iterate over our design and prioritize revisions that would enhance the users experience.
Affinity Map
Final Thoughts
Reflection, Next Steps, Lessons Learned
There were many takeaways from the Workery project. Finding participants for interviews was a bit difficult, as we had established a very specific criteria for users we wanted to speak to. Overall, our interviews led to very insightful information and helped us determine a clear path to creating our persona, empathy map, and user flows.
This project was approached mobile first in terms of wireframing and UI design, which presented both a challenge and an advantage. It made us consider how to best lay out our content and elements to a user that is consuming this content on a smaller screen. Information was presented in a way that didn’t require a lot of scrolling or searching to get to.
Next Steps: Fully flushing out the high fidelity prototype. There are a few different flows of navigation that need to be built out, including the flow for booking an on demand workspace.