Illustrator 3D
3D in a 2D world
In collaboration with the Adobe Substance Design team
Creating a 3D world for a 2D vector application like Illustrator was akin to the concept portrayed in the movie Inception-like building a dream within a dream.
Why?
Why the need to integrate 3D into a 2D vector software like Illustrator, especially when there are already standalone 3D applications available?
In observing prevalent visual design trends, we noted that 3D aesthetics were becoming increasingly popular across illustrations, character design, iconography, typography, and visual design systems. These trends were significantly making their mark in the user experience design space.
After engaging in discussions with our research team and interactions with our professional customers and new-age designers, it became clear there was a desire to create 3D designs within Illustrator.
Moreover, with Adobe's incorporation of the Substance suite of applications and 3D technology into our offerings, it seemed like the right time to explore the intersection of 3D and 2D worlds within a single vector application.
Imagery: Carol Wang on Behance
What?
What were we set to create? What elements had to be retained and what could be discarded? Indeed, it was a complex process as we navigated the "messy middle" while progressing with flexibility.
We developed the product roadmap in cohesion with both product management and engineering teams, shaping a sturdy and viable build plan.
Incorporating user research into our beta release cycles, we effectively used these to quickly iterate over our prototypes and verify our assumptions.
We adopted a strategic priority-based approach to select items from our roadmap. However, frequent technological hurdles and constraints necessitated adaptive design thinking to navigate the labyrinth of components that required construction.
Imagery: Ayesha Rana on Instagram
Illustrator 3D
“When you don’t have bread eat cake, said Marie Antoinette, the French queen, but you need to have flour, before you even attempt to bake bread or cake.
Do we have flour or not?”
The Flour, the Bread, the Cake & Toppings
The Flour: Progressive Rendering, Vector & Raster Fidelity, Performance
The Bread: Object, Materials, Lighting & Rendering, On-Canvas Transform Controls
The Cake: Object Properties (Extrude, Revolve, Inflate); Materials (Base & Substance Materials, Material Properties: Lighting (Color, Intensity, Rotation, Height, Ambient Light
The Toppings: Bevel, Material Kits, Light Kits, HDRI Lights, Texture Maps, Shadows, 3d Stickers & Groups (UV Mapping), On-Canvas Widgets for Lights, Realtime Rendering
“Sometimes, the toppings become all the attraction when your competition is offering the chocolate chips.”
The Plan & The People
The Plan & The People
Planning Priorities
Planning Research & Deliverables
Planning Betas & Testing
Lead Designer
Lead Designer
Product Management
Product Management
Engineering
Engineering
Program Management
Program Management
Research
Research
Design Leadership
Design Leadership
Challenges
-
The product roadmap went through multiple prioritisation and changes and we had to build the journey for a multi-year road map.
-
Realtime Rendering vs Progressive Rendering vs Performance vs Time to Render. Raster vs Vector Technology. 3d on a 2d canvas.
-
We were talking to multi-geo teams like Adobe Substance 3d teams in Paris and Seattle with multiple stakeholders to get buy-ins as well as marketing teams & preparing for Adobe Max keynote demos.
-
Research Budgets and shared researcher for the project meant delay in iteration and testing designs.
-
Are we borrowing from 3d tools or adapting for 2d users. Crafting for the design systems for desktop to scale for web systems in the future, also had to be a key area for exploration.
-
The team not only strived for a successful launch at Max but the aim was to constantly learn and iterate over the feedback that would impact our customers.
Impact 7% Ai MAU
⋆
2,90,190 users on launch
⋆
Impact 7% Ai MAU ⋆ 2,90,190 users on launch ⋆
What users said…
#Adobe #Illustrator's new #3D features are impressive, especially it being a #vector based program. Give it a try if you haven't already and especially try the new materials option under the 3D features. - Duvio Studio on Twitter
Illustrator et la 3d …lancer « l’effet de rendu 3d et matières » à l’ouverture de la fenêtre 3d me tue : trop long et pas utile. (Illustrator and 3d 🤔 …launching the “3d rendering effect and materials” when opening the 3d window kills me: too long and not useful). - Pascal Queru on Twitter
立体的なスマホの壁紙を作ってみました イラストレーターの3Dで簡単に作れます！いろんなポーズでバリエーション増やすと可愛いかも (I made a three-dimensional smartphone wallpaper Easy to make with illustrator 3D! It might be cute if you increase variations in various poses) - Assist001 on Twitter
ABC - Just playing with the updated 3d feature of adobe illustrator - Watanu45 on Twitter
Just x Fun. - Pizuikas on Twitter
New experiments with the @adobe Illustrator 3D feature and freeform gradients. - Ayesha Rana on Instagram
3d Inflate in Illustrator
has become a unique trend with creatives across
social Channels like Instagram, Etsy, Pinterest, Tiktok etc
“You can never get everything right at the first time, so keep at it, till you can.”
— My learnings on this project
-
![]()
3d in a 2d world
-
![]()
Retype
-
![]()
Mockup
-
![]()
Machine Intelligence Design
-
![]()
User Asks
-
![]()
Growth Experiments
-
![]()
Illustrator on Web
-
![]()
Illustrator for iPad
-
![]()
B2B: Adobe Experience Manager Assets
-
![]()
Adobe Design Mix
-
![]()
Hacks, Hobbies & Side Hustles
-
![]()
Patents & Presentations
