Kristen Kelly
KK
Kristen Kelly
KK

Adobe

Send, edit and sign documents seamlessly

During 2020 and the onset of the COVID Pandemic Adobe systems released the Acrobat All Tools page. Seamlessly changing the way to send documents.

Role
TIME
TEAM
Sr. UX Designer
October - December 2020
Me, a UX Designer, a Design Lead and other partners across cross-functional teams

An Overview

โ€How might we Update Adobe.com so users can navigate and purchase their Acrobat products with ease? ย 

โ€

โ€

Audience

Adobe.com users, individuals, small-medium businesses, enterprises, government, and health/science providers who use and send documents.

โ€

Deliverables

Sitemap, page types, SSOT, final layouts, and templates

โ€

Background

What is Adobe Acrobat Pro?

โ€

Adobe Acrobat is a family of application software and Web services developed by Adobe Systems to view, create, manipulate, print, and manage files in Portable Document Format (PDF).

There is data on 38,491 companies that use Adobe Acrobat Pro. The companies using Adobe Acrobat Pro are most often found in the United States and the Information Technology and Services industry. Adobe Acrobat Pro is most often used by companies with 50-200 employees and 1M-10M dollars in revenue. Our data for Adobe Acrobat Pro usage goes back as far as 7 years.*

*https://enlyft.com/tech/products/adobe-acrobat-pro


Top Countries that Use Acrobat Pro

โ€

โ€

Distribution of companies that use Adobe Acrobat Pro based on company size (Employees)


Distribution of companies that use Adobe Acrobat Pro based on company size (Revenue)


Research

Problem

Adobeโ€™s website had a confusing customer journey due to a poorly integrated sitemap and older pages with older consumer campaigns.
โ€

Hypothesis

I.A. structure can be organized by aligning the pages and distilling the page types across Document Cloud and Creative Cloud. Then visually re-branding the UI for a fresher look and feel.

โ€

The Challenge

How Might We: Update Adobe.com so users can navigate and purchase their Acrobat products with ease? ย 

โ€
  • Match page categories with Creative Cloud
  • Clean up the current site with an outdated look and dead-end pathways
  • Rebrand for an updated look

โ€

My Design Thinking Method is Based on the Double Diamond

โ€

โ€

The Solution

  • Collaborate designers met on DC (Document Cloud) and CC (Creative Cloud) to card sort and catalog pages to create a current I.A. map
  • Sweep the current site for old and new pages by taking screenshots and using a new sitemap
  • Refresh the site page by page, and update campaigns to market and sell seats to try or buy Acrobat

Design Process

  • Collaborate Information Architecture - The DC site map was massive so here is a crop with a legend.
Key or Legend
Crop of the massive sitemap

โ€

Sweep

Again, there were several pages so here are the main pages distilled to five types.

โ€

Page Types for Acrobat (Document Cloud) were collected to find common patterns

Blueprints

โ€

As I was collecting the page and organizing the patterns, another designer was leading 'Project Consonant' to redline the components and create standard patterns with typography, spacing, and sizing.

โ€

โ€

Blueprint Patterns and Components

Iย was in charge of creating the components with pixel-perfect spacing for designers to use to rebrand the UIย of the site. Here are some examples.

โ€

I spec'd and created the button standard sizing as well as the typography spacing/sizing.
UI components such as the marquees, asides, river flows and sign-offs were blueprinted into templates.

โ€

Here are column blade variations
Other miscellaneous items that could be used for the Adobe.com page design.
The components could be save in a library file to be dragged onto the site with type, colors and everything in place.

โ€

โ€

โ€

This case study is still under construction, to view an Adobe Max study, here is a link. password is: design (all lower case).

โ€

โ€

โ€

โ€


Visit Adobe.com - Acrobat

Visit acrobat.adobe.com - All Tools Page

โ€

โ€