As the lead designer of Deepblu, it was my responsibility to direct the design process. Every UX design project has a different scope and objectives. However, they generally follow the process of empathizing, defining, ideating, prototyping, validating, and iterating.

The development team at Deepblu adopted the Scrum framework, conducting three-week sprints. While the question of whether design should start before development or occur in parallel remains a topic of debate, the design team at Deepblu prioritized adaptability and flexibility within each sprint. As the lead designer, I integrated the Design Thinking framework into the Scrum development process, overseeing development specifications and facilitating design reviews with stakeholders.

I, along with our senior UI/UX designer, consistently participated in sprint planning meetings. The design team often initiated work while the development team focused on previously-defined product backlogs or constructing environments. Our intention was to stay slightly ahead, enabling us to validate designs and provide the necessary documentation to developers when required. The design team actively engaged in daily standup meetings to ensure effective communication.

Throughout each sprint, we prioritized supporting the development team, addressing any instances where additional definition was required. It was not uncommon to receive new feedback from users, colleagues, and stakeholders, which inevitably impacted our designs. To prevent scope creep, we collaborated with the development team to assess whether the changes could be accommodated within the current sprint or if they needed to be planned for future iterations.

Deepblu adopted a user-centric approach throughout its UX design process for both the app and website. To foster a deep understanding of the target audience, all employees were encouraged to experience scuba diving. Upon joining the company, most team members underwent Open Water certification, enabling them to empathize firsthand with our users. Furthermore, leveraging the company’s network, the design team had the unique opportunity to receive a freediving lesson from William Winram, a renowned Canadian freediving world record holder. These immersive experiences empower the design team to create intuitive interfaces that cater to the needs of our users.

To gain deeper insights into our target audience, we distributed surveys to scuba divers and freedivers of different proficiency levels. One advantage of our team was that all three co-founders were avid divers, with one even being a diving instructor, which provided us with a wealth of participants. We analyzed the data to later define our personas

Our outreach extended beyond individual divers to include partnerships with dive shops, allowing us to conduct focus groups and user interviews with a diverse range of participants, encompassing various experience levels in the diving community.

During the focus groups, we employed interactive activities like brainstorming sessions to gain insights into the needs, desires, and pain points of our target audience.

By conducting a thorough audit of our competitors’ features, strengths, weaknesses, and user feedback, we gained valuable insights into areas where we could strategically focus our efforts.

We conducted extensive product research on popular apps to identify prevailing trends. We carefully evaluated the merits of these trends, deciding which ones were worth incorporating into our platform. As part of this exploration, we utilized a tool called RealtimeBoard (now known as Miro) in 2015, which offered the needed collaborative capabilities.

Deepblu quickly gained recognition within the local scuba diving community. Occasionally, the company would organize events and diving days, inviting users to participate. These gatherings presented valuable opportunities for the design team and product development team to personally engage with our users and establish meaningful connections. By fostering these relationships, we could continue to gather feedback, conduct user testing, and involve them in the design process.

During my tenure at Deepblu, the company participated in numerous trade shows, where I had the opportunity to personally design 15 booths. As the lead designer, attending these shows in various countries was uncommon. However, on special occasions such as the 2016 DEMA show in Las Vegas, I had the privilege of directly engaging with our users, promoting our platform, and showcasing our products.

Using research findings from the empathize phase, we created personas to represent our target audience. These personas guided our design process while keeping our users at the forefront of our design decisions. They provided a tangible reference for the team to consider the diverse needs and preferences of different user segments. Whether it was understanding their motivations, their level of expertise, or their desired outcomes, these personas helped guide us in creating more targeted and meaningful user experiences.

Internal card-sorting exercises were done with the design team and dive expert colleagues to gain insights. On this occasion, the goal was to validate the frequency of use for each function listed.

The information architecture (IA) establishes a hierarchical organization of functions and features, ensuring a logical structure for navigation. Refining the IA is crucial to create a smooth and intuitive user experience.

User flows were created for each version, ranging from 1.0 to 3.5, to visually represent the steps required to complete tasks in our concepts. These flowcharts proved invaluable in efficiently identifying issues along the user journey.

Wireframes served as invaluable tools for mapping out the flow structure, hierarchy, and key elements of the app. With their low-fidelity nature, I could swiftly iterate and refine concepts before diving into detailed layouts. Throughout the project, I crafted numerous wireframes for each sprint, totaling over 20 wireframes for the app.

Using data from surveys, user interviews, and observations, the design team crafted moodboards to visually conceptualize the aesthetics of the app and website. While acknowledging that the style might evolve over time, our focus was on capturing the overall feeling. It was essential for the look to resonate with divers’ preferences while remaining consistent with our friendly and sociable visual identity.

Selected wireframes were transformed into low-fidelity prototypes using Axure RP, enabling us to test the flow with colleagues and real users. The inclusion of conditions and variables in the wireframes greatly facilitated function and navigation validation. The prototypes continue to function relatively well even after 8 years which was a pleasant surprise.

Interactive prototypes with actual screen layouts were often created using InVision. These prototypes served to demonstrate the flow and interactions and were tested by colleagues and users. After refining and confirming the flow and interactions, the prototypes were shared with our team of developers.

To effectively communicate interactions involving complex animations and transitions to the developers, I used Principle to create interactive prototypes.

Over time, the asset library for the Deepblu app grew to a substantial size of over 600 icons. As diving is a niche theme compared to most icon libraries, all of the icons used in the app had to be created in-house by me.

To facilitate seamless asset management, I implemented a process of pushing updates directly to GitHub for both the iOS and Android teams whenever I made changes. For iOS, the assets were prepared in the sizes of @1x, @2x, and @3x. For Android, they are resized to mdpi, hdpi, xhdpi, xxhdpi, and xxxhdpi.

To ensure developers had access to all necessary design specifications and resources, we utilized a combination of Confluence and Zeplin. Confluence served as a platform for comprehensive written guidelines, providing detailed documentation on components, typography, color palette, and other design elements. In Zeplin, we stored and shared precise style specifications, including margins, borders, paddings, color hex codes, font family, font sizes, and more. This collaborative approach ensured that developers had a clear understanding of the design requirements and could easily access and implement them during the development process.

Layout designs were created using the Sketch app. To manage the large number of layouts, they were grouped into separate pages based on the various functions of the app. This approach allowed for easy navigation and reference, with each page containing a specific set of layouts related to a particular aspect or feature of the app.

During each sprint, once designs were prototyped and validated, we moved on to detail the layouts, define the components, and export the assets.  The design team collaborated closely with project managers to produce documentation. We adopted Zeplin as our tool of choice for sharing and referencing layout design specifications. These specifications were also referenced and detailed on Confluence, ensuring that the necessary information was readily accessible to the team. Jira was used for tracking bugs. Since I no longer have access to the company’s accounts, no screenshots are available for this.