Adobe Design challenge
A 1-week design challenge I took part in as a part of Adobe Design's 2nd round of internship process
Brief
"To review the existing workflow and propose a design concept that relooks at the current Command+N experience for a user who creates a document for the first time in Adobe Illustrator"
Approach
The whole project was divided into 3 phases
Phase 1
Research
Phase 2
Ideation
Phase 3
Design
Existing user flow
Journey mapping
Storyboarding
Redefined problem statement
Requirement definition
Concept generation
Rough sketches
Wire-framing
UI Design
Phase 1
Research
Observing the existing workflow helped me map out the multiple interactions present & the possible ways a new
user would create a new document.
Since carrying out this task required me to observe every screen very carefully, I took this as an opportunity to observe possible inconsistencies or usability issues that could be present in the UI
Reviewing the existing workflow
Existing task flow
The current workflow is quite straight forward & a well-presented one. It presents the most appropriate options required by the user to create a document.
Along my journey of reviewing the flow, I came up with a few suggestions which could
-
help maintain consistency in UI in general
-
ease up the process while making documents related to web or mobile
Key insights from task flow
1. The heading for different units is missing as compared to its neighbouring options
Units missing from the new document window while being present in more settings
2. Options like bleed for Mobile and Web (screen focused content) are redundant and settings like grids
(gutter & column width) can be included to improve workflow speed
3. Templates present in New from template provide no information about their use-case
Screenshot of artboards from template “Banners & Presentation”. A text box with the names of the artboards will be helpful (eg banner large)
Okay, so now onto the main task, What does the user journey of a first-time user creating a new document look like?
Since there can be multiple use-cases to this, I focused on the one which best represents the problems of most first time users introduced to Illustrator.
Remember assignments and competitions where you need to make fancy posters ? That’s our use case. The reason for considering this scenario is, events and assignments like these in schools & colleges where students are most commonly introduced to design tools.
The Journey
Scenario
“Vedant’s college is holding its annual college fest and is holding a digital poster competition for the same. Vedant decides to take part in it and extremely excited to see what he can design digitally for the first time”
Persona
Vedant, 18
University Student
Vedant is a first year design student who loves doing art & craft. He always carries a sketchbook around with himself, sketching down what inspires him. He isn't hands-on with technology and finds himself to be a slow learner. Attending classes of design tools in college didn't help him cause it was too overwhelming
Goals
To keep exploring and creating art which satisfies him. He aims to start creating a professional portfolio this year as well
Frustrations
Unfamiliar with design softwares. Takes a lot of time learning softwares and ends up losing motivation in the process. Hesitant to jump ship on digital art
Storyboarding
Journey Mapping
Journey map of creating a new document by the new user
Key insights from Journey mapping
1.
The physical world is their reference.
-
Difficulty in visualising the size of the canvas they will be working on on the screen.
3.
Complex terms like bleed & raster cause unnecessary confusion.
-
First time users are not familiar to Terms like bleed, raster and colour profiles.
-
Imagine a first time user making a poster in RGB and printing it out only to notice that the colour are not what he was expecting to be because it was printed in CMYK
2.
Lack of contextual information about presets slows down the decision-making process.
-
Quantity of presets confuses a new user in deciding which one is appropriate for their use-case.
4.
Digital measurements are not convenient to relate to the real world.
-
Units like points and picas are difficult to gauge when compared to the physical measurement units such as centi-meter etc.
-
It’s much more faster & convenient to gauge the dimension of something in cm’s because of past experience of how we measure things.
The focused design brief
“First time user of illustrator can’t visualise their artboard size when coming from the real world to the digital world. The lack of contextual information about presets can lead to confusion in selecting the correct one to use”
Phase 2
Ideate
After gaining all the insights and defining the problem statement, now I went to my sketchbook to start making some rough concepts of what the opportunity areas I had discovered from the Journey map. To get start making the concepts I needed to first translate these opportunity areas into features.
Converting opportunity areas into design solutions
Concept generation
Concept : Comparing selected preset to A4/Letter size
The idea behind this concept was that people due to experience have a good idea of how big an A4 size (Letter size for the U.S) paper looks like, can visualize and compare the artboard which they have selected to an A4 sheet in Illustrator. This gap of not being able to visualize between the physical & digital realm can be reduced with this concept
Phase 3
Design
After all the concept sketches, came the part to bring them to life. The UI was also made into a clickable prototype to give a better idea of how the concept would look like when it would be used by the user
(A prototype speaks a thousand words, doesn’t it?)
UI for main concept highlighting the preset preview and the sort by feature
UI for the compare feature and it in the expanded view
(Click the image to enlarge)
%402x.png)
Feature to sort by the large to small size or vice versa according to the dimension of the artboard
Tooltip for options like bleeds, color mode and raster size. This one shows it for bleed. The same layout would be applied for color mode and raster size as well
Some extras
While the assignments brief was limited to the Cmd+N experience for a first time user, I believe that the process just doesn’t end at clicking the “Create” button but also extends to the point where the user can actually start working in the document (What’s the use of just staring a blank document after creating it?).
While working on this project, I had realized that there 2 very basic things that can help a new user to start working on the document :
-
Present the name of the basic tools besides their icon. Encourage the user to play and create in Illustrator instead of trying to figure out stuff.
-
Recommend a certain set of font sizes for the document selected, remove the error of the user trying to guess if the font size they’ve used is legible or not. It’s always the point where you take a printout of the document to realize that the font is smaller than you expected and have to go back and fix it.
