UX/UI Design
Case Study
Saas web application
The Problem:
Enable tenants to book office space in minutes instead of days through a real-time booking calendar.
My Roles
UX researcher,
Interaction Designer/UI,
Project Manager
Timeline
5 months
Team Size
In house we had 2 team members working on the project, and contracted with several cross functional teams to provide further development and testing
Tools
Illustrator,
Adobe XD,
UXpin,
Python (django framework),
Boostrap,
Jira,
Trello
Methods
Stakeholder Interviews, Competitor Analysis, Affinity Maps, Personas, Heuristic Evaluations, Usability Testing, Card Sorting, Prototyping
Creative Process
We identified core features and pages after interviewing major stakeholders and developed a development life cycle using an Agile metholodgy.
For years the client had been using disparate web applications to rent out his current office space to tenants and felt all the money and time he spent using these various applications together, which still lacked all of the features he wanted, could be put to better use creating the platform he needed.
PHASE 1
We met with the client to identify the site map/architecture, developed a Scope of Work, conducted a competitive analysis and primary research, developed personas, and carried out card sorting.
PHASE 2
Met with the developers to articulate and define the project requirements, developed user stories, and user flows.
PHASE 3
Conceptual ideation and modeling, Lo-Fi Wireframes were produced to test user flows, feedback and testing led to reiterating in greater fidelity. Development began two sprints behind design.
PHASE 4
QA and usability testing on development deliverables.
Core Features
The core pages and features we identified for a minimum viable product were: Search Functionality, Booking Calendar and Profile Pages. We indicated to the client that if they wanted us to develop this project, because we were a small team, then we had to stick with a lean approach to product design. Unfortunately, the client had big aspirations and was more familiar with a waterfall approach. We had to constantly persuade them to stay with the lean approach.
Scalable
Responsive Design
Versatile



User Experience Research
Collecting the field studies, client interviews and a handful of customer interviews, we created an affinity map. From the affinity map we generated several empathy maps: a renter, a landlord, and a new user.
Takeaways
I was initially skeptical that we could produce a solution that differentiated itself from competitors. As I delved deeper into the competitor analysis and learning about the client’s problem, I realized that the engine behind the search and the booking calendar needed to be developed to be robust enough to handle unanticipated use cases.
UX Design
It took several iterations to get the user flows right, each persona had several points of entry into the application and there were more than a handful of tasks/nuances to account for in their processes. Usability testing was crucial here and we used invision to test the logic of each task.
Wireframes
The client’s goal was to capture as much data as possible from users in order to power search results. This meant we needed to create a solution that kept the task of filling out form fields from feeling overwhelming. We also had to accommodate the robust search results filters in a logical and simple way.
UI Design
I implemented and extended the visual language created alongside our graphic designer for new elements and use cases.


REFLECTION
AGILE VS. WATERFALL
Initially, we discussed an agile approach with the client. The client really wanted to work with us, but as a smaller agency, we indicated that if we were to tackle this project, we would have to develop the application using the lean method. We identified the pages and features that would constitute a minimum viable product. Space Operator dashboard, Tenant Dashboard, Office Space Search Page, Booking calendar, Home page, About Page.
However, after months of ideation, prototyping and development, the client started to request more advanced features and the scope began to creep. It became clear the client would not settle for anything less than a waterfall development cycle where the application was equal to competitors.
OBSTACLES AND HURDLES
This project was a real learning experience for me as a project manager. Initially I conducted the research, created the wireframes, and developed out the user interface elements. Because of my early involvement in the project, I was tasked after the hand off of deliverables to the development team with project management. As my first big budget and sprawling project, I have been able to pinpoint a few instances early on in the process that if handled differently, may have saved time and money down the line.
PYTHON DEVELOPMENT AND PROJECT MANAGEMENT
The first development team came aboard when the project was striving to maintain an agile development. They built the backend and the first iterations of the front end. As the client became more involved in the later phases and started requesting changes, we included a second development team. While the development teams were able to fabricate working solutions, the push and pull between designers and developers on features and limitations in these phases was long and exhaustive. Our python developers would come back with restrictions on product features and in hindsight, including them earlier and having them more involved in the ideating stages would have prevented hiccups and waste later in the funnel.
THE VALUE HYPOTHESIS
While the Client really wanted to create a competitive application to existing marketplace solutions, the focus should have been on the unique value proposition. The value of this product was the real-time response of the booking calendar and space reservations. After analysis of this case study, if we had maintained focus around that value proposition I believe the product would have been stronger and stood out amongst competition.