top of page

Deadlines:
Are we on time?

Bloomfilter is a unique real-time health score mobile application with easy to view insights. Dramatically improves communication, predictability, and efficiency across your software projects. This is a story of how I made a positive difference to the use of this application by designing a web browser.

To comply with my confidentiality agreement I have gained approval to post these designs on my portfolio as this product bloomfilter is available in the app store.

Group 184.png

THE PROBLEM

How might we create a website from an existing mobile app?

Our client approaced us with a simple objective -- to create a desktop/web application similar to the iOS experience. First phase included only like to like designs similar to the mobile design and then phase two consisted of adding improvements/features to the UI.

responsive.webp

Problems observed from user behaviors

For most of our tools, the users were using the web and disturbed the workflow when they had to switch from the web to mobile to check the status of their projects. They wanted a more seamless experience and have access to all the project tracking tools in one web experience.

Product requirement

Access to a web portal so that users can access the mobile app via a desktop browser.

Requirement vs observation
The graphics/data visuals did not serve the data very well. I discovered that in addition to the web requirement, it was not considered part of the MVP, so we had to scope it out and cover it in the future.

Setting up to solve the problem

Since we had an existing mobile design, I knew I had to establish a navigation for the web the one differentiation from mobile. Then I had to replicate each screen and scale it up to fit a web page so that I would be able to maintain a consistent user experience.

MY ROLE

UX Designer

I was the UX designer on the Bloomfilter team and was responsible for creating a desktop experience similar to the existing iOS app design. I led the UX work, producing all major deliverables and presenting them to the client between July and September 2021. I worked alongside the business, product, and engineering team for feedback.

Timeline
Dec 20 - Jan 21

Tools

  • Figma

Teams

  • Product Owner

  • 2 Developers

Team Collaboration

I was the sole UX designer on the team.  I collaborated hand in hand with the product and development team that worked on designing the iOS application.

Communication was important to share our vision for the web portal. This helped create a good relationship with the Dev team and bridge the technical language gaps. The goal was to provide organized visuals such as mockups and flow charts that helped the team understand the designs clearly.

THE DIRECTION

Design Proposal

I focused on the application and the screens needed for the web design, so I took inventory of all the mobile screens plus navigation. I decided to divide each flow so that I can mimic the data for each screen.

Having an existing mobile design with a broad complexity for the users did not limit me from putting new ideas through sketching, wireframes, and prototyping. Based on the multiple web iterations of the design and feedback from the team, I was able to take bits and pieces from each iteration and present them to the team to show certain features that would bring out the final design. This is how I brought my experience into an effective way to carry out the final designs for implementation.

hsframe.png

Research/Exploration
Regardless of how much time I have in any project, I always take time out to do research on the task at hand, using the requirements.

In the tech world today 68% of software projects fail.This is why the success of this application was more important for the stakeholders. Since the functionality of this app does not exist it was difficult to find a comparable product. I came across various dashboard applications to help with creating a web experience for this application.

Understanding the current experience
I studied the current design and the design system, font, color aesthetics so that I can build a similar experience for web. This was not a time for re-design, and I had to keep in mind that the web experience needed to have the same look and feel as the mobile UI.

Since mobile design was already existing, I worked on sketching, wireframing, prototyping for the web, so I can have a better visual sense.

End Users
Project Managers, Product Owners

User Needs
IT team, Professional working on agile projects. Digital product teams.

Core Target Market
IT team, Professional working on agile projects. Digital product teams.

Pain Points
Only mobile iOS was available, PM worked mostly on desktops/browsers and needed access from their laptops to see all the projects they were working on. Using a mobile app was good for on-the-go access but they needed easy access on a desktop so they can view alongside their project management tools.

Screenshot 2024-01-22 at 9.56.31 PM.png
Screenshot 2024-01-22 at 10.58.33 PM.png
Sample Component.png

THE SOLUTION

Total Makeover Success

Our mission to comprehensively enhance the home delivery experience was a huge success. By immersing myself in every feature and workflow of the customer journey, the product team and I improved all the identified bottlenecks and areas of improvement.

The homegrown mobile application for delivery and warehouse technicians, along with the archaic customer care system, showed great signs of improvement not just in design but functionality as well.

Mobile App Redesign
By diving deep into the heart of Sleep Number’s home delivery experience, the team was able to identify core issues and implement strategic solutions. The comprehensive overhaul not only made the system more efficient but also significantly enhanced user experience and customer satisfaction. This project underscored the importance of hands-on experience and observation in crafting effective UX solutions.

Android Bottom Navigation
The bottom navigation bar provided clear and consistent navigation cues, as users can always see the current and available options. This reduces confusion and cognitive load and helps users form a mental model of the app's structure and functionality. This replaced the hamburger menu side drawer design.

Navigation Tab Screens

Tabbed navigation helped conserve screen real estate, which is particularly important in mobile applications where space is limited. By presenting content within tabs, I made efficient use of the available screen space, while still providing users with access to all the content they need.

Header
The app bar & and header component is a fixed dedicated bar at the top of the app canvas that displays important app-related functions, such as branding, top-level navigation, and access to app controls. The navigation menu in the header played a key role in guiding users through the application. Provided direct access to the user profile, enhancing user experience through ease of navigation.

Reorder Cards (Drag and Drop)

A drag-and-drop feature allowed users to customize the homepage to adjust the cards based on users' usage. They could simply drag and drop and arrange the layout according to their preference to limit the scrolling.

Group 435.jpg
Group 434.jpg

THE CHALLENGES

Obstacle Course

Crafting a top-notch UI design is a difficult task that demands time, energy, and imagination. Throughout the entire Sleep Number journey I constantly faced challenges that put my skills and creativity to the test. The struggle is real when balancing clients' demands and design aesthetics. Some of the challenges that I had to overcome during my journey at Sleep Number.

Vague or Evolving Requirements

Clients may provide unclear or changing project requirements, making it challenging for designers to establish a solid foundation for their work.

Communication Barriers
Effective communication was crucial, misunderstandings between designers and (offshore) developers were a huge problem, leading to misaligned expectations and dissatisfaction with the final deliverables.

Lack of User Research
Inadequate or skipped user research led to designs that did not resonate with the users, resulting in the non-adoption of a workflow. This led to the Super User program my next project that I embarked on. 

THE IMPACT

Chop. Chop. Go Beta Live

The designs are officially in Beta, no data has been collected to report to this section.

Implementation Success
It’s still early days for the service, yet the results have exceeded our expectations. Since the launch of the new design of the INVision App on Android, the interest shown by technicians has led to the creation of the Super User Program my next project that I worked on. Shhh... Coming Soon!

Despite this design still being in BETA, We might not have data yet to confirm the success, but during the process, we also improved our design process, project management, user feedback, and design handoffs for each sprint.

44% increase in points developed with an 81% reduction in incidents reported in production in 2023.

Screenshot 2023-12-08 at 3.35.21 PM.png

THE LEARNINGS

Retro: After Party

One of Sleep Number’s leadership principles is having a mindset, users don’t care for the design, as long as it gets the job done. There was a bit of proudness to insist that product decisions are reversible and spending time doing is better than over analyzing or holding off on the sprint release. We’ll fix it in the later sprints.

Throughout the Project

I observed how a reversible attitude converted into a let’s do it right the first time. Our team disproportionately focused on measuring outputs, rather than learning and measuring outcomes. This inevitably led to a lot of waste, short‐sightedness, and distraction for the team.

We let the Question
“How quickly can we build it?” define the it, more than we let our users define it. We let the phrase “Let’s just get something out there” define quality, more than we let our users define quality.

If we had asked “Are we building the right thing?” as much as we asked “Are we going to meet our date?“, we would have launched a more user-centric reliable, intuitive, and polished product, sooner.

Wishful Thinking
Viability should have been defined by our customers way before the technology and date already did. But, who am I kidding, we are a slave to technology and limited by it’s constraints.

Proud of Myself
I am extremely proud of the hustle that went into turning an entire app into a more refreshing appeal as far as the brand and vision of the app were concerned.

In Hindsight
We did 2 years' worth of work in one year with just one designer (Me) and a kick-ass team from product owner to ever-changing developers.

In the End

The hard work, intense collaboration, multitasking and shifting of ideas till last minute led this app to overachieve milestones!

Other Sleep Number Designs

A case study of the entire redesign of the INVisionn App is not possible. So below are images of a few of the kick-ass work that was done during my time with Sleep Number. 

bottom of page