Nextech AR Solutions

Threedy Ads Creator

Product Design
UX Research
The "Threedy Ads Creator" is a feature that allows marketers to create digital ads and templates within "Threedy.ai" without needing to export any 3D models. Its successful release meant that marketers had a direct platform to create interactive digital ads immediately after their model is processed and eliminated the need to create backgrounds, assets, and environments using third party tools.

ROLE

User Researcher, UX/UI Designer

TIMELINE

Aug. - Sep. 2021

TOOLS

Pen & paper, Figma, Figjam
Scroll to learn more
Part 1

Defining the problem

A LITTLE BIT OF CONTEXT

After its successful launch, Nextech found that the largest user base for "Threedy.ai" were digital marketers looking make 3D models for interactive digital ads. Normally, after creating a 3D model, a marketer would create an ad background via a third party tool, stitch the two pieces together and then upload it. From here, we saw an opportunity to create an easy to use, self-service ads creator within "Threedy.ai", simplifying the workflows and reducing the number of tools used by marketers. Thus, the concept for the Threedy Ads Creator was conceived, this singular platform would allow marketers to create engaging ads in a capacity previously unavailable to them and provide insights on ad engagement and impressions.

GOALS & DELIVERABLES

The goal of the project was to develop a tool that allowed users to directly design and implement web ads. In addition to the creator itself, the solution needed to also include several quality of life improvements and strictly adhere to the design systems used for Threedy.ai. The following list includes all the deliverables:

WHAT IS AN INTERACTIVE 3D AD?

Before I can even begin exploring pain points and solutions for the project, I needed to first understand what the platform was actually building. An interactive 3D ad is a web ad that includes a live interactable 3D models that allows people to directly move in the ad block, below are a few examples of the type of ads Nextech was hoping to build.

UNDERSTANDING HOW ADS ARE BUILT

Naturally these ads contain many complex parts and layers that needed to be built in succession. To that end I devised a simple flow chart that I validated with the development team. The goal of this exercise was to understand the thought process that goes behind building these ads and to make sure that my solution going forward would comply with this structure while clearly making sense to the clients.
Part 2

Understand the User

INSIGHTS AND PAIN POINTS

To better understand what kind of platform I needed to build, I first needed to answer the question - who are the people that would use this platform? To that end, I connected with the sales and development teams at Nextech to explore the target demographic and their current pain points and motivations. To keep my project scope refined and clear, I consolidated my findings into the following insights and pain points.

DEVELOPING PERSONAS

To better empathize and connect the target audience with my insights, I developed a series of personas based on common pain points and personality traits I found during my exploration. These personas span across the range of clients that Nextech hopes to reach out to, thereby ensuring that the proposed solution covers all of the targeted demographic and their respective pain points.

User task flows and information architecture

With my target audience fleshed out, my requirements established, and my understanding of ad building cleared up, my next logical step was to build out the task flow of my proposed solution. In my task flows, I made a concerted effort to make sure all the pages are preceded by a clear user motivation that directly ties with the user goals established in my personas.
Part 3

Design the Solution

UI EXPLORATIONS

To better visualize and ideate on my design solution, I started by exploring some popular UI trends and consolidated aspects that I wanted to include into my final design. Much of my explorations were in platforms that didn’t particularly relate to ads or model creation, but I felt their structure and layout would fit well with the problem space.

Airbnb

Duolingo

Google Drive

Asana

WIREFRAMING AND A/B TESTING

My next step was to directly visualize the core elements and layout of my solution. Typically I’d start with sketches and perform several rounds of user testing to validate my designs, however the extremely tight deadline of this project meant that I could only feasibly perform 1 round of testing. As a result I immediately went with 3 iterations low fidelity wireframes which I quickly validated using A/B Testing.

A

B (Chosen)

A (Chosen)

B

The solution

After validating my design and layout choices, I started to immediately design in high fidelity. Again, typically I’d have gone through several more refined iterations and user testing before starting high fidelity design, however due to the tight deadline I knew that I needed to work fast to apply personality and polish to the wireframes.

Visualized Selection Cards

During the ad creation process, I broke down the options into visual selection cards that better contextualize how the ad’s aesthetic and layout would be impacted by choice.

Large Interactive Preview

I ensured that users are as exposed to their end product as much as possible. This limits unwanted final results and provides users direct feedback on their design decisions.

Focused Analytics

I reduced as much on screen clutter as possible within the analytics page to ensure that users are able to digest what's shown on screen.

Accessible and visible call-to-action buttons

I ensured that the core actions are clearly visible and WCAG compliant. This mean that users are able quickly and reliably identify the core functions of embedding and sharing their ad.

Retrospective

DESIGNING IN CRUNCH

While I rarely am allowed an ideal amount of time for a project, this one in particular was genuinely tight and stressful deadline. However, despite the stressful experience I learned to prioritize key design and research decisions, and more importantly I learned to have a roadmap and plan for your designs going forward.

SOMETIMES, THE WRONG WAY IS THE RIGHT WAY

Between tight deadlines and demanding stakeholder requests, its rare to be able to start and finish a complete design process. And while those methods are undeniably fundamental in excellent design, its equally if not more important that designers learn how to adapt their process to suit the situation. Its a game of priorities, and as long as the principles of the design process are upheld, then a little bit of detouring is sometimes justified and frankly needed.

SOMETIMES, THE WRONG WAY IS THE RIGHT WAY

Between tight deadlines and demanding stakeholder requests, its rare to be able to start and finish a complete design process. And while those methods are undeniably fundamental in excellent design, its equally if not more important that designers learn how to adapt their process to suit the situation. Its a game of priorities, and as long as the principles of the design process are upheld, then a little bit of detouring is sometimes justified and frankly needed.

Let's chat and build something together.

© 2023 Brian Yew. All Rights Reserved.