Product Design + Tactile Design + Strategy
Product Designer & Team Lead
11.2018 - 11.2019
View Masabi.com
Masabi - Smart City Ticketing
Based in London, UK and is making city transport smarter by simplifying ticketing, streamlining fare collection, and validation for riders + transport agencies globally.
As a product designer and team lead at Masabi, I was responsible for designing end-to-end solutions from early ideation through design iterations and working closely with Front-End and Back-End to ensure data and feasibility of our designs within scope. Identified areas of overlap between/within teams, establishing a Design System and repository to ensure smooth collaboration.
Establishing a Discovery Phase
Above all, Masabi had a fantastic onboarding process for new hires to “get up to speed” on industry terminology, concepts and current roadmaps. In order to provide immediate value and understand what I could identify for my personal 30/60/90 day goals, I started with user flows and diagrams of the entire platform to understand the landscape
I continued my research to create and establish user personas and their jobs (JTBD) to better understand the customer and users of the platforms, and to effectively represent their voice.
Deliverables: competitive reviews, user personas, user jobs to be done, use cases, user flows, and rapid POCs (proof of concepts)
Graph Paper, Ideate, and Jazz
From concept to early scope planning and information architecture, I thrive with initial buzz of a project and establishing an MVP.
Working in 2 week sprints within the Hub Team, allowed us to move through graph paper sketches into rapid mid-fidelity prototypes. With this agile approach, we can test internally to identify pain points and make key Ux/Ui improvements based on our learnings and user feedback in design sprint critiques before moving to build.
Adobe xD allowed for rapid simple prototypes for early user testing, with final high-fidelity designs in Figma/Sketch + InVision allowed for a stellar product and team collaboration and comments across Front End, Back End and Product Managers.
Sketching/Iteration sessions tend to lead me to BandCamp Weekly and Coffee Table Jazz playlists.
Deliverables: Crazy 8s sessions, card sorting exercises, design system components, prototypes, mockups, user testing and feedback
Customer and Rider Interactions
Working in a B2B2C, each project/feature/improvement had various constraints and boundaries to adhere too. Rapid prototypes, InVision, and TypeForm allowed for various types of user testing and design validations.
Interactions included moderated sessions, a/b testing, feature demos, training, video-guided tours, user guides, and field and vehicle testing.
Tap & Ride (ABT - account-based ticketing)
We developed an account-based ticketing system (think Oyster across cities) for ticketless travel. Working closely with our native iOS + Android app teams to create a delightful rider experience that allows them to load funds into a balance and travel without purchasing a paper ticket.
We later partnered with Uber and integrated our SDK into their app – today you can now find bus, ferry, and train tickets available in the Uber app. Read more here about the first implementation with RTD Denver trains.
** Please note that by the nature of the work, many designs can be discussed, but not shared **
Establishing a Design System
Identified areas of overlap between and within teams, and collaborated with Front End to establish an internal Design System (Vue DS) to ensure smooth Design/FE collaboration. This also has become a “sandbox” for quick FE iterations before Production (without the constraints of Data Models and dependencies)
With the current framework being used on FE Vue JS, we decided to build with Vue DS framework and to move any NEW component into the system. This enabled use to trial and iterate the system, saving time by not bringing all old components in immediately.
We have demoed across teams and have seen other x-teams beginning to adopt the components for quick prototypes and concepts.
Validator Hardware & Tactile Design
Working with the validation hardware team in bringing the JRV Validator to market. This project was great to be involved in to see digital design (eDrawings and CAD) meet the tangible world.
Meeting with Royal National Institute of Blind People (RNIB) for user feedback throughout, we were able to bring tactile elements into the external shell of the device, and maintaining accessibility guidelines for the TFT screen and front unit glass.
Unboxing of the Just Ride Validator
DesOps + Dual Track Design
With Masabi having strong roots in Engineering, design and design thinking is represented later in the roadmap and planning. Identifying areas for improvement and pitching implementation of DesOps (Medium: Design Ops) to the management team.
DesignOps is not a new design department. It's 'how' interfaces between design, product, and engineering are managed. DesignOps is about creating a culture of user-centricity and agility over time. It puts design not just another step along the way, but as a continuous ritual of handovers and feedback.
We have begun to implement a Dual-Track Agile is therefore also based on the "Lean Startup methods ". With these experiments, these teams were able to quickly determine whether the chosen product direction is valid or not. The business risk could thus be further reduced.