Salesforce Stakeholder Impact Report Design System Creation

Designed at Launch Interactive LLC.

We took a 71 page annual PDF report and created a design system where components were used to create an immersive microsite that was easy to navigate for a variety of users. We worked with the Salesforce team (who was only familiar with print design) to figure out the best way to create a flexible design system that the Salesforce team could reuse every year for their new digital Stakeholder Impact Report.

The client came back the following year to work with our team again on the next annual report where I created a process for the project team to help them be most efficient in their work flow.

Old PDF stakeholder impact report

Process

We started out by interviewing 3 stakeholders. We then pulled out themes from each of the interviews to align on goals for the project. Next, we narrowed down the audience we were designing for to 2 primary audiences (investors & ESG analysts as well as corporate sustainability teams from other companies) and 2 secondary. We wanted to make sure that we were creating an experience that was best for not just the user but the client team as well knowing the design would be reutilized every year so we lead a virtual workshop with the client team providing some opportunity areas and allowing everyone that was a part of the call to sketch some ideas for the new site.

Primary audience slide from the Discovery Report.

Opportunity area from client workshop

Client sketches from workshop

From there we started to focus on design. We did a competitive audit as well as some market research to see how other companies were presenting their annual Impact Reports to find best practices. Our team decided to take it a step further and look at digital experiences outside of the report format to get some inspiration for how we could organize the content to tell the best story and create an experience that was easily navigable.

As we went into the design phase we were confident that we were going to take a component based approach. We did an audit of the existing Salesforce Stakeholder Impact Report PDF to see what type of components we would need to design knowing that the content stays fairly consistent year over year.

A section page from the new design.

I designed component wireframes in Sketch to create a component library that would make up the entire microsite. The creative team at Launch then took that component library and created visuals for each. We put together a few page templates to present to the client so that they could see how we planned on combining these components and for the developers to see the basic structure of each page type.

When creating each page template and navigation, I had to keep each audience type in mind. Investors & ESG Analysts are focused on the data and don’t have the time to dive deep into content. Corporate Sustainability Teams want to see the data, but they also want to know the story behind how Salesforce accomplished their goals.

Next, I created a component shell document that broke down each component for the client to use to build out the content for the microsite. The client would receive content from different contributors and I would help them choose from the component library to best fit copy to a component to create a page that had a seamless flow both visually and with the way the story was told. The developers then used this copy document to build out each page.

Results

From start to finish this project took about a year to complete. The Salesforce team now has a complete microsite composed of components that they can reuse year over year and an experience that allows for all primary audience types to find the information that they want to see in the format they want to see it in.