Responsive Web Platform Design | Startup Client
Designing an Online Restaurant Reservation Booking Platform
How might we design and seamlessly integrate a consumer facing web portal into an existing product ecosystem?
Defining and designing an online booking platform that allows users to find restaurants, search, and book reservation times – while ensuring the user experience aligns with an existing suite of mobile apps.
Scenario & Background
Reserve was a restaurant technology startup with a connected ecosystem of B2B and B2C technology products that facilitated a two-way communication network - allowing for real-time demand for a reservations to be disseminated from consumers directly to restaurants.
Early iterations of the product focused primarily on targeting consumer users via a set of native applications (iOS & Android). As the user base grew, the brand matured, and the product evolved, the need for a consumer-facing website became a resounding question internally and commonplace amongst user feedback on the product.
Internally, everyone understood the potential impact, however two factors were preventing any initiative from moving forward. The first was a question: will the return on investment was equivalent or greater than the time and resources required to execute the initiative? The second was opinions and assumptions around what the consumer-facing web platform should do, offer, and provide for a user.
The initial ask was to provide the executive team with a better understanding and recommendations for what a consumer-facing web platform could look like in terms of a product offering, how it could fit into the existing product ecosystem, and the level-of-effort from internal teams to design, develop, populate, and launch the platform.
Based on the positive outcome of the initial ask, the second phase of this project focused on further defining the product, then bringing it to life through design and development.
Reserve was a small startup with big goals, a lean team and limited resources. I was the design lead and sole designer on this project. I was responsible for planning and executing both research and design from ideation, through to development. Additionally, I collaborated directly with content, engineering, and QA team and conducted consultations with the CPO, VP of Design, CEO, COO, and CTO throughout the lifecycle of the project to foster inclusion, generate ideas, and facilitate progress and decision making.
My Role & Contribution
As the design lead on this project, I was responsible for leading, coordinating, and/or facilitating all aspects of design definition, design execution, and product management for this feature.
Design Definition Activities
Included collaborating with business and technology stakeholders to define feature requirements, KPI's, & goals, coordinating user research and discovery, and organizing collaborative ideation activities with designers and stakeholders.
Design Execution Activities
Included the definition and/or facilitation of system architecture, key flows and interactions, iterative wireframe design, the planning and coordination of online user testing sessions, user interface & visual design, and the creation of developer specifications & documentation.
Product Management Activities
Included the definition of project timelines & milestones, defining requirements & mapping corresponding user stories, setting and maintaining the cadence of design sprints, facilitating stakeholder discussion & decision making, and collaborating with development team through development, QA, design reviews & launch.
Process & Deliverables
Phase 1: Discovery, Analysis, & Planning
Phase 2: System Design & Definition
Phase 3: Detailed Interaction & Visual Design
Phase 4: Development, QA, & Launch
Outcomes, Learnings, and Takeaways
By focusing key stakeholders on the value of launching an MVP first, then adding incremental features, we were able to push out a product, measure, and see results quickly. Within the first few months after launch, we saw a positive impact on several key metrics that were helping to move the business forward. Additionally, by launching the web platform with an MVP feature set, we were able to better understand true user behavior and gain a better understanding of what existing features within the product truly offered them value and utility.
Learnings & Takeaways:
Garner support for an initiative by defining your success criteria early
Articulating and socializing what success would look like for an initiative and defining a set of MVP release requirements early in the process can help to focus stakeholders on the bigger picture and, in turn, garner support for an initiative.
Utilize provocations to highlight unknowns, engage, and focus stakeholders
When faced with the potential swirl of debate and indecision, strategically insert bold questions and provocations that focus stakeholders on the important questions and fuzzy areas of a problem that need to be addressed to ensure progress
Define your MVP requirements early, then continuously socialize and refine
Avoid scope creep by defining, articulating, and socializing a set of MVP release requirements early in the process, then continuously socializing these requirements with stakeholders throughout the design and development process.
A partnership with your technology stakeholders ensures success
An open dialogue with technology stakeholders early and throughout the planning and development process not only fosters inclusion, it also ensures clarity and community around what can and will be built, if any blockers exist, what front and back-end development resources will be needed, and how releases can be sequenced to get a product out of the door as quickly as possible.
Want to know more?
An in-depth case study of the design process & deliverables for this project is available on Behance.