Elevating Business Through Design

“Let’s Get You There” – The 66degrees mantra

Product Design In the Cloud

66degrees is a top-ranked Google Cloud Premier Partner that helps organizations securely modernize their infrastructure, apps, and collaboration using Google Cloud. As their sole Product Designer for nearly a year, I led various internal, external, and B2B/SaaS solutions while also serving as the company’s visual design resource.

This page provides detail on select available, impactful work samples that shaped both product and organizational direction:

  • A ‘Retail AI’ application that showcased the company’s technical expertise during Google Cloud Next ’22, elevating our visibility with potential clients
  • 66degrees’ first design system, establishing foundational elements for consistent user experiences across all digital products
  • Serving as the company-wide visual design resource, ensuring brand cohesion and professional presentation across client-facing and internal materials
  • Advancing design thinking throughout the organization, demonstrating how user-centered approaches could accelerate business growth and enhance client solutions

Scroll down to explore these key projects and see how each contribution delivered strategic value!

Showing Off AI Capability

Summary

Google Cloud Next is an annual conference showcasing Google Cloud’s latest innovations. At the 2022 event, 66degrees demonstrated its AI-powered inventory management capabilities with a ‘Retail AI’ app. In collaboration with a team of Developers, Product Management, Marketing, and Executive Leadership, I designed the app to show how grocery store managers could leverage this technology. It was a quick but impactful, high-visibility project that 66degrees was proud to show off.

Constraints

Time was the main constraint for this project. 66degrees received the invite to participate in Google Cloud Next roughly 3 weeks before the event, so we had to move quickly. There were a lot of moving parts with the app being part of a larger presentation by Marketing and Engineering. Close collaboration and regular communication was essential to our success.

Roles

  • Product Design Lead; responsible for all UX/UI design tasks.
  • Visual Designer; providing additional support for asset creation.

Duration

3 weeks

Platforms

Native mobile app

Deliverables

  • Low Fidelity Wireframes
  • High Fidelity Mockups
  • Prototype
  • Visual Design Assets

Tools

  • Figma
  • Miro
  • Photoshop

From 'Rough' to 'Ready' In 3 Weeks

As mentioned, we didn’t have a lot of time. Fortunately, we only needed to build out the main flow because the app was used as a demonstration. Without time to perform research, the team’s own collective intuition was relied upon to produce a logical user journey. 

Internal discovery with PM, Marketing, and Engineering revealed key elements of the demonstration, necessary information for design kick-off

The idea to design a grocery store app was inspired by Google Cloud technologies that 66degrees had recently worked with. Product Management provided a user story (see below) along with high-level Miro wireframes. Through discovery sessions with PM, Marketing, and Engineering, Product Design gathered the necessary insights to map out the experience.

User Story: ‘As a Grocery Store Manager, I want to be notified when an item is out of stock or misplaced so that I can quickly re-order or re-position the item.’

Low-fidelity wireframes provided clarity on specific steps of the user journey to be defined while eliminating confusion

PM’s wireframes provided key ideas and features but lacked a complete user journey. Creating low-fidelity wireframes for each step ensured a logical flow. This process revealed the need for confirmation and updated alert screens. It also highlighted confusion between the terms ‘alert’ and ‘notification,’ leading to the universal use of ‘alert’ and removal of ‘notification.’

NOTE: not all wireframes are shown

Low-fidelity wireframes provided clarity on specific steps of the user journey to be defined while eliminating confusion

PM’s wireframes provided key ideas and features but lacked a complete user journey. Creating low-fidelity wireframes for each step ensured a logical flow. This process revealed the need for confirmation and updated alert screens. It also highlighted confusion between ‘alert’ and ‘notification,’ leading to the universal use of ‘alert’ and removal of ‘notification’ for clarity.

NOTE: not all wireframes are shown

Icons from Google's Material Symbols provided fast, consistent, and well-styled iconography

Leveraging Google’s iconography through the Material Symbols plugin for Figma wasn’t just a strategic choice for our Google Event presentation. It also streamlined the transition from low-fidelity wireframes to high-fidelity mockups, ensuring consistency and a polished, professional aesthetic.

High Fidelity_1-1
High Fidelity_1-2
High Fidelity_1-3
High Fidelity_1-4
High Fidelity_1-5

Team feedback on higher fidelity: prioritizing company representation and expanding the journey

Following wireframes and understanding the full user flow, a first pass at high-fidelity mockups was created. An organic green color palette that reflected the grocery theme was used, but through team collaboration, this, and other adjustments were decided upon:

  • Despite the team’s agreement that green was a good choice for a main color, it was decided that using 66degrees’ brand colors would be a better fit given the app’s usage
  • Expand the user flow to include login, loading, and updated inventory screens for a more complete experience
  • Create a logo that referenced the app’s AI vision technology

Team feedback on higher fidelity: prioritizing company representation and expanding the journey

Following wireframes and understanding the full user flow, a first pass at high-fidelity mockups was created. An organic green color palette that reflected the grocery theme was used, but through a team collaboration, this and other adjustments were decided upon:

  • Despite the team’s agreement that green was a good choice for a main color, it was decided that using 66degrees’ brand colors would be a better fit given the app’s usage
  • Expand the user flow to include login, loading, and updated inventory screens for a more complete experience
  • Create a logo that references the app’s AI vision technology
High Fidelity_1-1
High Fidelity_1-2
High Fidelity_1-3
High Fidelity_1-4
High Fidelity_1-5

Final designs: a healthy balance between practical design and company representation

Together, the team reached a balanced app demonstration that we were all proud to present:

  • 66degrees’ black, white, and other brand colors were implemented for brand recognition
  • Login, loading, and updated inventory screens were added to the user flow for a more complete experience
  • A logo showing an illustration of a camera was created as a nod to the involvement of cameras in the AI system
High Fidelity_2-1
High Fidelity_2-2
High Fidelity_2-3
High Fidelity_2-4
High Fidelity_2-5
High Fidelity_2-6
High Fidelity_2-7

Outcomes

Impact

With the Retail AI app being limited to a demonstration and not for customer use, it generated value for both the company and myself in other ways:

  • The app was demonstrated to 30k+ Google Cloud Next attendees (virtual and on-site) during 66degrees’ presentation timeslot, boosting the company’s profile
  • The project was a great opportunity to collaborate with lead team members and leadership. Through the process, 66degrees’ design culture gained more recognition and respect, and I was able to demonstrate my design and teamwork skills. I truly enjoyed the collaboration process!

If I Had More Time

With more time, some things that I would like to have done include:

  • Take a closer look at the app’s user flow and features to ensure that redundancies were eliminated and every feature served a purpose
  • Explore creating more sections of the app (Current Events, Settings, etc.). The concept of the Retail AI app was of genuine interest to me, so given more time, I would have enjoyed going further with it

What I Learned

From this project, some lessons that I learned include:

  • Keep the team informed. With the project’s accelerated timeframe, moving quickly required that all of the key players were aware of its status. Leveraging a dedicated Slack channel and daily stand-ups served as helpful tools
  • Balance diverse perspectives thoughtfully. Given the project’s high visibility, it attracted feedback from across the company. While valuing every contribution, I found particular value in insights from those with domain expertise relevant to our challenges. This selective approach helped distill meaningful guidance while maintaining the core vision and technical integrity of the solution.

Increased Design Efficiency

A few months into my time at 66degrees, I realized I would frequently be working on projects that required the company’s look and feel. Creating a design system allowed me to work more efficiently and consistently. Using 66degrees’ brand guidelines and website (created by a 3rd party) as a reference, I created global styles for typography and color as well as a few commonly-used components. It proved to be helpful, as I used it for several web and mobile app designs.

Being a Design Authority & Resource

I was often leveraged as a general visual design resource. I assisted with ensuring that brand guidelines were adhered to, created video edits, designed logos, designed stickers, and advised on general aesthetics. Albeit “adjacent” to UX design, I thoroughly enjoyed this part of the job 🎨

Pounding the Design Pavement

A significant part of my job involved developing 66degrees’ design practice and evangelizing design culture across the company. I developed design processes, advised the company on design best practices, and helped to make design work part of 66degrees’ profile. Some of my achievements include:

  • Creation of design processes leading to the acquisition of 4+ new clients, resulting in 5% business growth
  • Fully developed design sprint workflow
  • Structure and organization introduced for design artifacts, assets, and design documentation
  • Increased report and respect for a user-centered approach to solutioning

back to top