Productive approached us with a functional MVP operating at a limited scale. We helped in enhancing their digital infrastructure with an upgraded digital system.
TEAM MEMBERS
Ram, Kyathi, Shrayes and I
TIME FRAME
May 2021 to Sep 2021
ROLE
Product Designer
CATEGORY
Productivity
USER BASE
Singapore
PRODUCTIVE’S
STORY
Productive is a Singapore-based early startup who offered booking working spaces. Freelancers, college students and loan managers were their primary users. They collaborated with inactive nightclubs and cafes in their locality and made a deal out of utilizing these as "focus spaces" for anyone in need of a budget friendly workspace.
AND...
The goal of this project was to help them scale from one to multiple location bookings through a web application.
DESIGN BRIEF
With a few months of operation focused on single-location bookings via a Webflow site and Google Form, the business experienced a daily volume of 5 to 10 bookings. Leveraging existing marketing channels, including the website and Instagram, the goal is to expand to three locations within two months. Additionally, exploring partnerships with food chains to provide daily meals is under consideration.
TECHNICAL BRIEF
- Devices: Web application with cross-browser functionality on Chrome, Safari and Firefox.
- Offers: Day Pass, Hourly pass, OTP verifications and email verifications.
- Payment methods: QR code scan payments.
DESIGN CONSTRAINTS
Operating entirely remotely, our project was based in Singapore. Our team's interactions with the client through daily calls were instrumental in collecting valuable insights. Initial phases heavily relied on secondary research to guide design decisions, with primary insights being gathered once the MVP was launched.
UNDERSTANDING
THE REALITIES ON GROUND
1. What are the USPs (Unique Selling Points) and offerings that Productive is ready to sell?
2. As the business has to expand and scale what other offerings are intended to be added?
3. What is the existing process on the ground?
IMPORTANTLY, WHO ARE THE
USERS?
Since the client (Shrayes) himself was well aware of the on-ground challenges and process, they provided us with some minimum requirements and factors to consider out of their learnings. Further, by analysing the requirements, we could do our research or come up with questions. We were informed about who is the existing stakeholder and the potential stakeholders of this system.
“I am a student. Looking for a working space to collaborate with my friends. Also, I cannot shed a lot of money.”
A Customers
“I am employed by the company directly. I work on shift basis. My responsibilities are to make sure customers do not have any hassle. Since this is a bar converted to co-working space, all has to be setup on time.”
A Manager at the workspace
“I am employed by the company directly. I am responsible to pickup orders food from the respective restaurants and hand it over to the customers at the workspace.”
A FOOD DELIVERY PARTNER
“I could be employed by the company directly or I could be on of the founders as well. I get to access the application as an admin and make sure daily delivery and bookings go through smoothly. I listen to customer feedback as well.”
An admin
BEFORE GETTING ON TO THE SOLUTION, SECONDARY RESEARCH INCLUDED...
COMPETITOR ANALYSIS
Productive is not a new idea in the space of co-working space booking. I looked at aspects like location listings, booking flow, user accounts, other offerings, product interface while analyzing the competitors.
Who are the competitors I looked at?
WeWork | Flexday | Croissant | Switch | Coworker
Since we are early, unlike the competitors we need not offer membership based booking. It can be booking per head.
Maintain familiarity with the user interface design to align with users’ mental models.
Simplify the booking process by eliminating the need for users to create an account.
Prioritize amenities and services to enhance user satisfaction
WEBSITE ANALYTICS
Referring to the user base and stats from the already functional Webflow site, we started with the assumption that more than 50% of customers use mobile phones to make fast booking.
Among all the OS, more than 80% are iPhone users.
Need for a responsive site for mobile, iPad and desktop.
HYPOTHETICAL USER PERSONA
I did not have access to direct customers at the initial stages of design.
I created hypothetical personas based on the demographic and behavioral information gathered from secondary research. I have used these personas as my best educated guesses of potential user needs and pain points.
STAKEHOLDER RELATIONSHIP MAPPING
Who is a stakeholder? A stakeholder is anyone who is a representation of the various individuals and groups involved with a particular challenge or system[2].
“We need a structured way to overlook on all the stakeholder actions on the daily basis. Such as, a part-timer, food delivery partner, admin, a manager from restaurant chain and manager from activity center." - Client
"We need flexibility in changing time slots by location. There might be dynamic time slots on a couple of days in the week." - Client
PUTTING THE
PIECES TOGETHER
At this stage, I collaborated with developers to construct an Information Architecture. A simple IA gives an easy view to all the team-members of the user flows and information flow.
I received updated brand colors and fonts from the client.
DESIGN ITERATION #1
Mobile: Login-signup flow
Mobile: Browse > Book > Payment flow
IDENTIFIED ISSUES AFTER FEEDBACK
Lack of time for developing a native app.
We did not have a plan to send SMS to customers as it was adding on the cost. Decided to remove accounts.
This version took 3 clicks to make a booking. We can reduce to just 2.
The bookings are available only in slot basis. We could remove the calendar and give direct time slots.
There is a logistic constraint that one can book only for the next day.
DESIGN ITERATION #2
Desktop: Landing Page > Browse Locations
Desktop: Day Pass form/Hourly Pass form
Desktop: Booking food and activity ad-ons
Design challenge: How to introduce secondary offers such that it
would not distract users from booking the location?
- Experimented by introducing the offers right before the payment.
- Applied UX cognitive biases like "Anchoring bias" on pricing to encourage booking.
Desktop: Complete payment. After the payment, customers will receive an email what details of booking along with an OTP
that needs to be produced next day when they visit the location.
Mobile Responsive View: Browse Locations > Book Location > Select Add-ons > Payment
Mobile Responsive View: Part-timer screen
A part-timer is a person who Productive hires who overlooks the logistics on the ground.
THE DEVELOPMENT STARTED BY AIMING TO RELEASE BETA IN TWO MONTHS
Safari browser inconsistant with UI styles
We noticed that the UI was inconsistent with the design when viewed on the Safari browser. ✨ To address this issue, I promptly decided to adopt the Bootstrap UI framework. Bootstrap simplifies the process of initiating projects by offering thoroughly defined UI components and robust cross-browser compatibility.
Challenges in Testing Across iOS Releases
Lack of iOS-supported devices at our disposal posed a challenge in thoroughly testing developments across every release. We depended on client feedback and third-party apps to assess the impact of our changes.
TIME FOR VALIDATIONS FROM OUR USERS
By the time we release the beta version, Productive finalized deals with 2 more cafes, 1 restaurant partner and 1 indoor activity hub partner. The food and activity add-on was still in an experimental stage where we wanted to test if customers would like the idea.
OBSERVATIONS & CONSIDERATIONS
90%
of our users accessed the app from their iPhones. Hence, for further iteration we focused on mobile experience.
form Usability
Users gave us feedback on how the booking from was way downwards after the details of location. We needed to reduce the long scroll.
ADD-ON VISIBILITY
Addressing this usability issue and effectively persuading users to add food and activity add-ons into their carts requires a strategic approach. Considering the feedback from the client about add-ons going unnoticed, here are some strategies to enhance user engagement and increase add-on conversions:
Strategic Placement: Position the add-ons prominently on the page, preferably at the top. Placing them within the natural flow of the page increases their visibility.
Clear Descriptions: Provide concise and compelling descriptions for each add-on. Highlight the benefits users will gain by adding them.
Limited-Time Offers: Create a sense of urgency by incorporating limited-time offers for add-ons.
AFTER
Sticky button: Made the submit button as fixed through the scroll
REFLECTIONS ON PROCESS
As a growing designer, I learnt how design thinking is never a linear path.
Things I could have done differently
Finding opportunities for primary research
Simple user survey/online interviews cloud have given me more detailed sense of who are the people I am designing for. Also, a learning about the demography I am not familiar with. That is, Singaporeans.
A broader understanding of co-working space landscape
The competitor analysis I did was very focused on the digital product. Just the UI. What I overlooked, was the details that productive evolved into more of a service system which has the webapp as a small part.
A cleaner dev and design cycle
Often, the developing takes the control of what the design has to be be. In this case, at many places I saw design taking the back seat whenever release cycles were coming close. Stricter feature freeze. Saying no to the client.