top of page
Executive
360
Overview
Executive leadership came to me looking to reimagine how our CEO engages with customers and events. Their existing process could not keep up with the scale of the business. My role as the sole designer was to leverage an existing contact system and create a comprehensive portal to make coordinating events easier across the organization.
Role & Timeframe
UI/UX Designer
User Research, Concepting, Wireframing, UI Design, User Flow, Sketching, Prototyping
2020 - 6 Month Project
The Problem
Executive leadership relied on a dated contact and event tracking process that could not handle the growing scale of the business. This lack of visibility made coordinating across leadership both difficult and cumbersome.
INITIAL RESEARCH
Designing When You Can't Access the End-User
It was important early on to be able to understand the current processes in place that were failing to effectively support the business. This problem space, however, was unique in that I'd have little to no access to speak with the end-user due to the confidentiality of the project. The heightened security around executive leadership meant I was provided little context before joining this project, strictly given info on a "need to know" basis. To get up to speed I had to instead establish contact with Marc's direct team, comprised of executive assistants and program managers to better understand the current gaps in the system and what needed to be prioritized.
​
After internal meetings and interviews, I visualized the existing process (found below)
EXISTING PROCESS
Meetings for Marc come in via an ongoing pipeline. As account teams near proposal stages within deals, they will start to engage executive leadership to get buy-in and find available meeting slots.
These meeting requests are then submitted through an internal doc for review by the executive team. Once approved they must solidify meeting times, with limited visibility of an overarching schedule.​
Marc gets briefed on each event only 1-2 days prior. This comes in the form of a physical binder with informational documents including event type, contacts, and related files. A clunky and cumbersome handoff.
ADDRESSING PAIN POINTS
Where are the design opportunities based on current pains?
After breaking down the scheduling process, myself and the engineer on the project identified the key pain points we were looking to solve. We focused on achieving a digital product that would greatly improve visibility for the executive team and also give them better control of the content shown.
![AdobeStock_327880808 [Converted]-02.png](https://static.wixstatic.com/media/efdf34_ec4ad5e2ea7a4d15a5c6b58677befbf1~mv2.png/v1/fill/w_72,h_73,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/AdobeStock_327880808%20%5BConverted%5D-02.png)
Lack of Visibility
At the moment there is no single view of Marc's schedule. Instead the team relied on spreasheets to coordinate incoming requests.
Completely Manual
Briefing documents were physically compiled before events. Not only were these cumbersome but they took upwards of 5 hrs to prepare.
![AdobeStock_332690326 [Converted]-02.png](https://static.wixstatic.com/media/efdf34_d24693f9c5f6445cb702db33f561cc62~mv2.png/v1/fill/w_80,h_73,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/AdobeStock_332690326%20%5BConverted%5D-02.png)
Poor Insights
Marc likes to prioritize certain information. We needed to give him better control on filtering information and data to cater to his needs.
RESEARCHING THE PRODUCT SPACE
How are people currently solving scheduling?
Scheduling is certainly not a new issue. But in this build, we needed to solve specifically for the businesses specific use case. That being said I wanted to take a holistic view of what sort of view would be best for the Ipad which would be the primary device we were solving for.
Google is an industry-standard for scheduling but for a few reasons it wasn't the ideal use case here. For one, we needed the ability to associate more information to each event including a detailed contact card that had been pre-built separately before the project. Additionally, since the calendar focused on one main user we didn't need the level of control to add in other calendars and non-relevant events.
Dreamforce App 2019
The executives wanted me to have similar styling to the previous years' Dreamforce app. This app did a strong job of being easily visible on mobile/iPad devices and focusing more on day views with associated events. I tried to pull elements that were successful and align with the design style being used.
Eventbrite App
Although not exclusively focused on scheduling, Eventbrite still deals with event management on its platform. I found it helpful to view how they highlight events (at volume) and see how the app functions across multiple devices.
EARLY IDEATION
During early conversations with our executive stakeholders, I sketched out my initial ideas for the weekday interface. I noted their specific requests for certain components that needed to be incorporated. My industrial design background often leads me to start sketching my concepts before moving to any digital design.
Initial Meeting Notes | Digitally Translated
MOCKUP REFINEMENT
Exploring a compact scheduling interface
After compiling the notes from our initial kickoff meetings I started ideating on the general framework for the main event management page. I had to keep in mind that the app would primarily be used on the iPad, making for a more compact UI than web. Below you'll see some variations as I determined what layout would work best for the expected volume of meetings.
Experimenting with a day view similar to Google Calendar. The page quickly felt like it would be overwhelmed with the size of the event cards.
Explored the use of a sidebar and controlling the dates shown via a dropdown. Started to map out the hierarchy of the event-specific page. Team members liked the side panel component.
Modified the sidebar to serve as more of a dashboard, highlighting key metrics related to the week's events. Also included profile image.
USER INTERFACE
Style Guide
Leveraging the Salesforce SLDS design system
TYPOGRAPHY
Salesforce Sans
Salesforce Sans Bold (16 pt)
H1
PRIMARY FONT
Aa
Aa
H2
Aa
Salesforce Sans Book (14 pt)
Paragraph
Book
Regular
Bold
Salesforce Sans Reg (10 pt)
COLORS
Azure
#0070D2
Emerald
#4BCA81
Kasmir
#54698D
Gray
#F7F7F7
Koromiko
#FFB75D
DESIGN SYSTEM
GETTING STAKEHOLDER BUY-IN
Initial Design Concept
After running through wireframes with my engineering team, I went ahead and did a higher fidelity proof of concept to present to our internal stakeholders. Achieving buy-in early on was vital for this project and thus I wanted to get them excited about what the vision could be. In this case I was also able to gather some great feedback early on to move forward in refining my design.
V1. Home Screen
"
We'd be interested in having more control over the events that will be shown. Being able to focus in on certain events.
"
Can we show where the user Marc is at during the week and grey out things that have happened in the past?
"
Given the variability in guests for these events we would love to have different options for showing contacts.
v1. Events Page
FEEDBACK #1
Establishing Date Hierarchy
After getting feedback around more weekday visibility I integrated multiple states for the date component to better convey where the user was in the current week. Establishing an active, prior, and the upcoming state would allow the user to understand the week at a glance and remove the responsibility of the user to figure out the day of the week.
Previous
Active
Upcoming
FEEDBACK #2
Providing User Control
We needed to give the executive team and Marc more control during busy weeks. Since each event would have a parent category, I established a filtering system on the home page centered around the three main categories. These categories were specified by the executive team and would filter down the number of meetings under each day.
After getting feedback around more weekday visibility I integrated multiple states for the date component to better convey where the user was in the current week. Establishing an active, prior, and the upcoming state would allow the user to understand the week at a glance and remove the responsibility of the user to figure out the day of the week.
SHIPPED EXPERIENCE
Final Design Outputs
After addressing multiple rounds of feedback and user testing, I landed on the finalized design which is shown below. Adding in the filter really rounded out the page and gave more intention to the events section which could clearly be controlled via different variables.
Weekday
Oversight
Meetings for Marc come in a pipeline fashion. As account teams near proposal stages within deals, they will start to engage executive leadership to get potential executive meetings on their radar.
FEEDBACK #3
Compact View
While working through designs I realized that using the previously built contact cards as the sole component on the event page would not scale for larger events. With events having an upward of 200+ attendees, I needed an alternate option to show a high volume of guests. To workaround, I utilized a Salesforce modified list view to allow individual search and awareness of whether invited contacts would be attending.
Event
Overview
Events, being a key piece of this dashboard needed their own defined sub-page. The page itself was designed to show high level content about the event including attendees, date & time, and all relevant documents tied to the event.
More to come...
This project is still under implementation as I work with our engineering team to execute the above design. I have worked closely with the team to ensure consistency across the product as well as providing advice on a back-end community for account teams requesting meetings.
User Flow Section
bottom of page