Facebook Business Manager was a suite of tools created at different times by different teams to help advertisers run ad campaigns on Facebook and Instagram. After many years, it was difficult to understand what each tool was for or how to use it.

My role was to lead a design overhaul of the homepage to make it easier for small businesses to use while also not detracting value from large businesses.

Process

Original Business HomeRedesigned Business Home

We spent time with multiple small businesses to understand their day-to-day and how Facebook and Instagram help them grow their businesses. This research confirmed that the existing home page didn't help streamline workflows or steer businesses towards any meaningful actions.

After running a design sprint with key stakeholders within Meta, we concluded that so many tools and user types ruled out a one-size-fits-all approach. We decided to create a platform for the teams who own those tools to design into since they know their individual users better than we could.

Layout

We developed a column system to help build a consistent silhouette while supporting different scenarios and use cases:

• The left column is larger to provide more room for contextual, role-based cards that would change depending on a user's tools, jobs and preferences. These are dynamic and customizable. This is the column Meta partner teams could build into.
• The right column is smaller for scannable lists and other universal cards that all users need. These are consistent but fill with different types of data, like alerts or guidance depending on the user's role. They are static to keep important items in the same place for all users.

Cards

The system also needed to be future-proof and scale as new tools were created by partner teams. We designed the homepage to include widgets that provide necessary information to understand what needs attention and a deep link into the source tool to address those issues. This makes the framework flexible enough for teams to build into, but consistent enough to feel cohesive.

Each card conveys necessary information for a user to understand what they need to act on, then quickly takes them to the place to do that work. This makes the framework flexible enough for teams to build into, but consistent enough to feel cohesive.

Outcome

For our MVP, we started small and leveraged our current users: experienced large advertisers. We collaborated strategically with select teams to build our initial set of cards and validate the concept.

Our MVP solution includes:

• Data visualizations to compare and contrast account performance and quickly identify areas to work on
• A quick way to access your Facebook Pages for posts and edits
• Critical alerts bubbled up to ensure they're seen
• Guidance cards as a comms channel to help users grow

We shipped this solution to 25% of our MVP audience (large businesses) and 10% of our total users to get signal on the design and concept. We achieved net neutral revenue and visitation metrics, which helped establish a baseline for the framework to be built upon with minimal impact to our existing power users.

As the national airline of Bahrain and the travel hub of the Middle East, Gulf Air needed a complete redesign of their in-flight entertainment system to match its newly redesigned brand and livery.

Process

We used surveys and stakeholder interviews to understand what fliers in the Middle East valued around air travel and media consumption.

We used our findings to craft four concepts focusing on different value propositions, including hyper-personalization, destination-centric, in-flight itinerary and mood-based content.

Mood-based User Experience

The mood-based concept was chosen because it best reflected what Gulf Air and Bahrain are best known for: hospitality.

The experience was designed around the user's immediate needs. The IFE greets the user by name, asking how he or she is doing today and in response, different moods can be chosen. The options presented are tailored to that choice.

• Feeling tired? Take a nap and have the flight attendant wake you at a certain time.
• Feeling adventurous? Explore the best spots at your destination or learn about local customs.
• Feeling productive? Order a coffee then turn on Do Not Disturb so you can focus.

This experience was designed to both complement and be an extension of the world-class Gulf Air flight staff. It also offered shopping as well as the ability to order food from Gulf Air's SkyChef.

Design Considerations

The seat-back displays on the new Gulf Air planes are 17", so navigation was designed to use broad gestures to flip up and down between categories and left and right between items. The centered carousel was designed to accommodate both left-to-right and right-to-left languages with minimal UI changes. The system is also intentionally modular, so the experience still feels complete when only the Islamic Prayer category is available for holy voyages to Mecca, a journey offered by Gulf Air.

Lastly, the experience was mirrored on a handset so users could browse, add items to their playlist queue and order food without interrupting their viewing experience.

Testing and Deliverables

To quickly iterate and improve, we did three rounds of remote RITE (rapid iteration, testing and evaluation) with Middle Eastern airline customers. We identified issues around organization and interaction details and refined to improve usability.

Our final deliverable was a document thoroughly articulating the system and design decisions, as well as design and motion specs. Lastly, we created a video showcasing the system for the stakeholders at Gulf Air to sell the work to leadership.

Key Takeaways

This work taught me to consider the gaps between how different cultures use technology and to avoid assumptions based on Western ideas. I also had the opportunity to explore my own personal leadership style by running the project as design lead.

Chronicle is a concept for a platform and app that integrates real-time environmental, biometric and self-reported data to improve health outcomes for people with chronic conditions. A user's current context is compared with data and outcomes of other users who have been in similar situations, providing meaningful insights for better decisions in common, day-to-day scenarios.

Using the Chronicle app, you can:

1. Observe quantifiable progress based on suggestions to improve your condition. Suggestions are based on what has worked for other users with similar environments and symptoms.
2. Review health and condition history to spot trends and review collected data with a healthcare provider.
3. Track biometrics in real-time to better understand what exertion is doing to your body when you get more active to improve symptoms, but would like to do so safely.

Groove Music (formerly known as Xbox Music) was the default music player that shipped with Windows 10. A Windows 10 app could scale to different screen sizes and form factors, so we created a user experience that would dynamically adapt while still retaining core functionality.

‹ ›

My design partner and I considered each UI element and how it would scale. For example, how does the playback bar scale from a large laptop screen to a tablet in portrait mode to a small low-cost phone with poor resolution?

We also worked closely with the Windows 10 design system team to provide feedback and help inform their decisions.

The Charms Bar was a universal, system-level interaction built into Windows 8, and a differentiating feature of the OS. A swipe gesture from the right edge of a screen would always reveal common actions:

• Search — search across your system, apps or the Internet
• Share — share on-screen content to people or apps
• Start — a dynamic and customizable launcher
• Devices — project content to other screens
• Settings — adjust settings on the fly

We designed the UI so third party apps could plug into this user experience by keeping the interface consistent across the experience but providing the ability for apps to express their own branding using color.

‹ ›

Key Takeaways

This work massively influenced my design process — I learned to think in systems that could inform broad solutions rather than individual applications. I also learned how to build a global product and ensure it scales across languages, cultures and abilities.