Adobe Illustrator Client Presentation Feature

Few final screens of Adobe Client Presentation on an iPad
Adobe Illustrator Presentation feature streamlines the process for designers to showcase their designs to clients in a cohesive workflow

During my 12-week internship on the Adobe Illustrator team, I conducted user testing, explored feature iterations, and collaborated closely with engineers to deliver a solution that enhances how designers engage with their clients. The Client Presentation feature enables designers to present their work seamlessly while empowering users to provide feedback through in-app annotations, elevating the overall presentation experience.

Project Overview

Overview
Design a solution that enhances designer-client collaboration, driving increased adoption of Adobe Illustrator on the iPad for both parties.

Solution
Develop a presentation feature that: (1) allows designers to present their work in an intuitive and streamlined way, (2) provides clients with tools to offer real-time comments and annotations, and (3) allows designers to make live edits during presentations for a more interactive and efficient experience.

Timeline
3 months

My Role
User Experience Design, User Experience Research, Brand Design, Product Thinking, Contextual Inquiry, Wireframing, Rapid Prototyping

User Research

I first collected user research from the researcher on our team, Laura. Laura performed user testing with illustrators and graphic designers from the United States and Japan.

If I can just hand them a pen and say, "Here, show me," that helps me, because I'm visual, and then they're not writing it out. It also makes it faster for the both of us.

— Kelsey, Freelance Editorial Designer & Illustrator

Key findings from the user interviews revealed:

  • Both current and non-iPad users saw potential in leveraging the iPad for client interactions.
  • Most participants anticipated the need for ‘Preview’ and ‘Presentation’ modes to enhance client communication.
  • There was strong interest in a quick, easy way to create short animations, which would greatly enhance client presentations."

Competitive Analysis

To kick off my design explorations, I analyzed key presentation apps on the iPad to inform the user experience for the presentation feature. I examined both their strengths and weaknesses, focusing on how their features addressed user needs. This analysis allowed me to iterate on a solution that effectively solves user pain points. I drew insights from platforms such as Apple Keynote, Microsoft PowerPoint, and Google Slides.

Apple Keynote Presentation Mode
Apple Keynote holds presentation notes on the left hand side on the iPad. Only shows the upcoming slide but no current slide.
Apple Keynote
Google Slides presentation mode
Google Slides holds presentation notes at the bottom on the iPad. It shows the current slide and upcoming on the left.

Google Slides

Microsoft Powerpoint presentation mode
Microsoft Powerpoint holds presentation notes on the right hand side on the iPad. It shows the current slide and upcoming at the bottom.

Microsoft Powerpoint

As part of my design explorations, I identified key elements critical to a presentation workflow, including the ability to display speaker notes, the current slide, and upcoming slides. In addition, users have an easy way to exit the presentation mode.

Personas

I developed user personas to better define the target users for this feature. The two main personas were:

Charlie

Illustration of a man presenting to his coworkers

Presenter’s View when connecting iPad to monitor

  • Seamlessly present multiple artboards in Illustrator
  • Quickly edit or iterate on designs during presentations
  • Jot down feedback and comments from stakeholders

Nicholas

Illustration of two men shaking hands

Presenting designs to clients on the iPad:

  • Clients have limited editing control to indicate tweaks
  • Professional, efficient, and presentable solution for showcasing designs

UX Flow Chart

To kick off the design process, I created a UX Flow Chart to visualize the various tasks a user could perform within the presentation feature. This helped me conceptualize user actions like managing artboards, adding presentation notes, and creating or commenting on edits within the canvases.

Flow chart of client presentation feature
Organizing the client presentation feature in a flow chart enables me to identify and design important interactions in the workflow

Sketches

Before wireframing, I sketched out the basic layout of the presentation feature and discussed the user flows with my team to assess which were intuitive or needed refinement. The sketching phase allowed for rapid iteration based on feedback, ensuring an optimal user experience from the start.

Sketches of selecting artboards to present
Sketches of selecting artboards to present
Sketches of being able to mark up art boards and leave comments in presentation feature
Sketches of being able to mark up art boards and leave comments in presentation feature

Hi-fidelity Prototype

Click here to view the prototype

Leveraging Adobe’s Design System, I incorporated their style and icons to create high-fidelity wireframes for the presentation feature. I iterated multiple times before finalizing the design. While the full experience is prototyped, here are a few key features:

Artboard Management

Users are able to add speaker notes to their work in presentation mode. They can also reorder their artboards.
Users are able to add speaker notes to their work in presentation mode. They can also reorder their artboards.

Users can arrange artboards, add speaker notes, reorder, or hide them to prepare for presentations, giving them full control over the presentation setup on the iPad.

Interactive Markup Tools

Wireframes of users leaving comments and audio feedback on work in presentation mode
Wireframes of users leaving comments and audio feedback on work in presentation mode

Designers and clients can easily access tools to draw, comment, and annotate directly on the artboard, facilitating hands-on feedback that designers can revisit and address.

Customizable presentation views & Link sharing:

Users are able to toggle showing mark-ups and comments in presentation and editing mode
Users are able to toggle showing mark-ups and comments in presentation and editing mode

Designers can toggle visibility for comments and markups within the presentation mode via a top-bar menu, providing flexibility for both presentations and working directly on the canvas.

Designers can generate a shareable link with customizable editing permissions. The link is automatically copied and ready for distribution, streamlining client collaboration.

Design Decisions

Throughout the design process, I received feedback and quickly iterated to refine the final product. Each iteration involved thorough reviews with my manager, design team, and engineering team to align with stakeholder expectations. Below are the key improvements made during the process:

Deprecated design of users being able to delete art boards in presentation mode
Old Layout
The original design offered too many options for rearranging artboards, including edge cases like deleting or cutting an artboard. This led to confusion about whether an artboard would be removed from the presentation or the entire canvas.
Current design of users being able to either hide or duplicate their artboard
New Layout
The revised version streamlines the options to duplicating and hiding artboards—two of the most common user actions. Speaker notes were repositioned for a more intuitive flow, making it easier for users to read and write their notes.
Old design of tapping anywhere on canvas to type and manually save their comment
Old Commenting System
The initial iteration allowed users to tap anywhere to comment, but comments had to be manually saved via a button on the top bar, creating extra steps.
Current design of having a toolbar so clients are able to mark up artboard, leave comments, and audio recording.
New Toolbar Design
The updated design introduces a more flexible toolbar on the left-hand side, offering additional markup tools like drawing, commenting, and typing. Auto-save functionality was also integrated, and the top bar now includes options to record meetings and more.

Reflection

Moving Forward

As I conclude my internship at Adobe, I’m proud to leave behind a presentation feature that is intuitive for both designers and clients. This feature will undergo further review for future releases of Adobe Illustrator on the iPad. Our UX researcher, Lauren, will continue testing my prototype, and the engineering team will begin integrating it into the beta app.

Final Thoughts

Reflecting on my time at Adobe, I am incredibly grateful for this experience. Designing for Adobe Illustrator, the very tool that sparked my passion for design, feels like a manifestation of my goals. While there were debates about expanding this feature beyond Adobe Illustrator to other Creative Cloud apps, I focused on building a simple yet powerful user experience that could serve as a foundation for broader application.

In a remote internship setting, I took the initiative to communicate effectively with my team, setting up meetings and asking questions when needed. My manager, Damon Nelson, shared that I initially struggled with pitching ideas to the team, but this taught me to embrace my potential and creativity. Special thanks to Damon Nelson for his support, and to Gabe Campbell for being an inspiring designer. I also want to thank Laura Herman, Mallika Yelandur, Sarah Smart, and Deepanjana Chakravarti for their guidance throughout this project!

View More