Anheuser-Busch
Digital Asset Management System
About the Project
Working with a data start-up in NYC (Apollo), I designed and oversaw the development of a digital asset management system for Anheuser-Busch.
Challenge:
The DAM had a very specific set of business and user requirements as it would only be a piece of the larger product's functionality. The first client that would be utilizing this tool for internal use was Anheuser-Busch.. who also had a specific set of requirements and flows to account for all their user types around the world.
The biggest challenge I faced was the fact that this project had an accelerated timeline of 6 weeks for UX, visual & build. This meant that constant communication across timezones and countries was necessary to deliver on time. I worked closely with the product owner, visual designer, producer, and the development team based in British Columbia. We followed an agile process and successfully met our deadline for the MVP handoff.
My role:
User research & analysis
MVP definition
Wireframes
Visual Design & Development oversight
I used Lean UX principles in the development of the Digital Asset Management System platform to move quickly and focus users on their specific tasks:
Identify user segments to reveal and map individual needs
MVP definition
Developing User-Centric features, by focusing on the specific actions each user of the DAM would need to take
Tailored toolkit including Sketch templates, iconography and style guide
Externalizing work by using Google sheets, InVision prototypes & the internal development tool Confluence
What we don’t know about people exceeds what we do know.
Apollo’s mission is to help close this gap by collecting, structuring, and analyzing data from consumer behaviors, habits, locations, purchases, and media consumption then combining it with interactions from brand marketing and asset data.
Research
Heuristic Audit
The first step in my process was to become familiar with the client and brand/markets within the Anheuser-Busch ecosystem. For each client (Budweiser, Corona or Stella for example), there were a set of users that needed specific access and editing privileges. This could be an Admin user, internal creative or a third-party vendor for external asset upload. Similarly, we were handling specific project user roles as well. Understanding the needs of each user allowed us to design the permissions necessary within the larger system.
I used a Google sheet to track along and validate all the actions and information needed on each screen of our MVP.
User Flows & Sketches
Mapping the user flow identified the key actions that would need to be addressed for each user's goals and behaviors. In conducting this exercise, I found out that the main issues my design decisions have to solve are:
Ability to review and suggest edits within the third-party asset upload flow
Identifying the appropriate label and associated permissions for each user type beginning at login
Assigning required fields for assets being uploaded
Various "view" states and information based on your assigned role
Mapping the Platform
As this project was quite accelerated, I only had a handful of hours slotted for research and journey mapping. I utilized the tracking doc to identify user groups/actions needed.. and created a high-level sitemap to show all the pages that we'd be laying out for the MVP. Structuring the information in this way influenced the development of important design decisions and key functionality for the app. Some are as follows:
Information hierarchy & requirements for specific user segments
Profile setup and welcome tour to help new users get acquainted
In-app communication for asset approvals and next steps for internal users & outside vendors
Mid-fidelity Wireframes
Once I had an understanding of our users and all the necessary pages for the MVP, I translated my sketches into mid-fidelity wireframes. Working on a section at a time, I would present wires first to the product owner, then to the full team every 2 days. This flow allowed for quick review and changes.. and once updates were made, I would post to the InVision for the team to continue to leave comments as I moved on to the next section.
I opted for a clean, simple layout with the key actions at the top of the page. That included the ability to search across clients, markets & projects (role permitting).. as well as filtering further using the checkbox grid navigation. Additional filtering and sort functionality was also available to further narrow the assets. The main header included a hamburger navigation for account actions, along with a notification dropdown and a CTA to begin the upload flow.
Wireframes were exported to an InVision prototype for product owner/team review and comment.
Design for Simplification
As I was designing the wireframes in sections/groups and approval was rolling in a little stagnated.. I was able to pass things to the visual designer as I continued working. Since we had a variety of user types that would be utilizing this system, we wanted to keep everything very clean and modern when it came to the visual design. Our designer created a style guide and icon treatment that would be easily identifiable throughout the DAM.
With a goal of modern and clean, the primary colors used were slightly off white and black. This left the secondary colors to be used for key actions and giving prominence to information in an intuitive way. Similarly, the Helvetica Neue font family was used as it's recognizable and friendly.
Keeping the design choices simple also allowed us to play with animation to bring the DAM to live. Lastly, as shown in the imagery below, the first event that Anheuser-Busch would be utilizing the DAM was for the 2018 World Cup.
What have I learned from this project?
Building something from the ground up — Apollo's product is the first to combine consumer and asset intelligence into a singular platform. This creates a cool opportunity to be part of the team and to influence a larger product that has huge potential.
Effective communication — is absolutely essential with a deadline this tight. Focusing meeting conversations to what had to be explained, answered and mapped out was the only way to accomplish this. Slack was also crucial to getting quick answers in this fast-paced design & dev environment.