top of page
ARitize360.png

Revolutionizing E-commerce with ARitize360: A Journey Through Immersive Design and Transformation

OVERVIEW

ARitize360 is a revolutionary B2B application designed to empower eCommerce entrepreneurs in seamlessly capturing and transforming products into immersive 3D and Augmented Reality assets. This immersive experience is achieved on a large scale, eliminating the need for extensive training. The application equips e-commerce vendors with powerful tools to engage customers through a comprehensive 360-degree experience or by placing products seamlessly within their physical surroundings using Augmented Reality (AR).

PROJECT DEADLINE

March 2020 - April 2020

4 weeks

PRODUCT

3D Asset Capture App

Content Management Site

Responsive Marketing Landing Page

Responsive Price Guide page 

App Store Content

MY ROLE

Research & Strategy

IA & Wireframing

Prototyping

Design Assets

Visual Identity & Branding

Accessibility Improvements   

UI Design  

Testing

Marketing Material

The Nextech innovation team engineered cutting-edge technology for capturing specific objects via mobile devices, generating 3D assets for augmented reality. My role was to design an application facilitating the effortless and intuitive capture of items while navigating through intricate technical constraints.

DELIVERABLES & CONSIDERATIONS

1.   High fidelity design of the consumer facing 3D product capture app 

2.  Mobile and desktop marketing landing pages 

3.  Subscription/Pricing page

4.  App store content

5.  Content management site

6.  Email notification designs and copy

7.  Accessibility Improvements

INTRODUCTION

INITIATING THE DESIGN JOURNEY

3 DAY DESIGN CHALLENGE

The initial phase commenced with the assignment of a 3-day design challenge, an integral part of the hiring process at NextechAR. The task was to craft low-fidelity wireframes for an app dedicated to capturing items in 3D and storing them in a library. Promptly, I initiated market research, drawing inspiration from applications such as Display Land, Scann3D, Apple, and Samsung's Bixby.

Group.png

Display Land

Apple

Bixby

Scann3d

Upon concluding the competitive market analysis, I delved into contemplating potential use cases and identifying the target users for this app. Acknowledging NextechAR's existing eCommerce website with 3D and AR models, I constructed a persona tailored to represent individuals who would find substantial value in such an application—an e-commerce entrepreneur.

Sandy Johnson.jpg

Analyzing the researched apps, I honed in on essential features like instructions, guidance, and user feedback. This laid the foundation for sketching and ideating the user flow, manifesting as rudimentary wireframes that visualized the architectural aspects of product capture.

CONCEPT SKETCHES
AR2.png
AR1.png

With the foundational architecture and creation flow firmly established, I progressed to crafting higher fidelity wireframes. Upon completion of the high-fidelity (hifi) wireframes, I translated them into a clickable prototype. This prototype became the canvas for user testing, engaging individuals within the targeted demographic.

Conducting user tests with acquaintances from the e-commerce demographic, I scrutinized the flow and for any potential issues. Fortunately, the feedback was overwhelmingly positive, indicating a seamless user experience.

Encouraged by the positive results, I submitted the design to the hiring manager. The outcome surpassed expectations as I not only secured an interview but also received commendable feedback from the CEO, affirming the effectiveness of the design.

DESIGN CHALLENGE PROTOTYPE
7_pixel_quite_black_portrait.png
16_pixel_quite_black_portrait.png
20_pixel_quite_black_portrait.png
22_pixel_quite_black_portrait.png

ONBOARDING TO ARITIZE 360

Upon securing the position, my initial responsibility was the redesign of the ARitize360 app. Despite its existing presence in the app store, it was evident that a comprehensive UX/UI overhaul was imperative for optimal performance. Remarkably, I assumed the role as the sole UX/UI designer within the Nextech team, marking the initiation of an exhilarating challenge.

Below, you'll find glimpses of the app in its pre-redesign state, setting the stage for the transformative journey undertaken to enhance its usability and visual appeal.

PRE-EXISTING APP DESIGN
iPhone 8 Copy_google-pixel4xl-clearlywhi
iPhone 8 Copy 4_google-pixel4xl-clearlyw
Image from iOS (14)_google-pixel4xl-clea
how it works 2_google-pixel4xl-clearlywh

THE INITIAL STRATEGY: NAVIGATING A THREE-WEEK DEADLINE

Embarking on a tight three-week deadline, my first step was an extensive information-gathering process. I collaborated closely with stakeholders to discern the intricacies of the target demographic. Engaging developers provided crucial insights into technical constraints, while the marketing team offered valuable branding elements, including the existing logo. To maintain brand coherence, I adopted the font from the Nextech website.

Despite the challenging timeframe, the consolidated information propelled me forward with an enhanced focus. Now equipped with a clear understanding of the target demographic and business requirements, I delved into the crucial task of seeking UI inspiration. The objective was to craft an app that not only appealed to entrepreneurs visually but also exuded innovation and operated seamlessly.

UI INSPIRATION
Screen Shot 2020-03-17 at 4.22.58 PM.png
Screen Shot 2020-03-17 at 4.22.46 PM.png
Bitmap.png
EARLY UI EXPLORATIONS
LogIn Copy 4_google-pixel4xl-clearlywhit
LogIn Copy 5_google-pixel4xl-clearlywhit
home menu copy_google-pixel4-clearlywhite-portrait.png
home menu_google-pixel4-clearlywhite-portrait.png

DESIGN EVOLUTION: HIGH-FIDELITY UNVEILING

I used the research and design I applied to the 3 day design challenge and proceeded to design the rest of the app in High Fidelity. There was no style guide or design system to work from so I was essentially designing the visual identity and branding as well. To try to keep consistent with our products, I used the font that was used on the Nextech website. I took advantage of the graphic designer on the marketing team to assist with the visual assets. 

 

The technical constraints very much pertained to how a product needed to be captured. The technology couldn't capture anything shiny, there could be no background noise, the pace in which the product needed to make rotations needed to be communicated, along with the length of time, and product set up. It was an overwhelming amount of information to communicate while trying to keeping the app simple.  Below is the design to help train people to set up and capture their products.   

ONBOARDING SECTION: NAVIGATING TECHNICAL CONSTRAINTS

The intricacies of product capture posed significant technical challenges. The technology's limitations included an inability to capture shiny objects, the necessity for a noise-free environment, the communication of rotation speed, duration, and product setup. Balancing these complexities while maintaining a user-friendly interface was a formidable task. Below is a glimpse into the design crafted to guide users through the intricate process of setting up and capturing their products.

Tips intro Copy 2_google-pixel4-clearlywhite-portrait.png
Tips intro Copy 3_google-pixel4-clearlywhite-portrait.png
Tips intro Copy 5_google-pixel4-clearlywhite-portrait.png
Tips intro Copy_google-pixel4-clearlywhite-portrait.png

PRODUCT CAPTURE FLOW: NAVIGATING THE ESSENCE

Transitioning seamlessly from the onboarding phase, the subsequent focus was on designing the product capture flow. This crucial stage involved users setting up their products and initiating the capturing process.

In the initial design concept, the intention was to incorporate directional user feedback, intending to guide users on their capturing journey. The envisioned feedback included prompts about movement speed, whether they were too fast or too slow, and guidance on adjusting proximity. Unfortunately, due to technical constraints, implementing these recommendations proved to be unfeasible.

Below, you'll find a snapshot of some of the feedback and capture screens, offering a visual journey through the product capture phase. Each screen encapsulates the essence of the design, illustrating the user's progression through the intricate process of capturing their products.

iPhone 8 Copy 10_google-pixel4-clearlywhite-portrait.png
iPhone 8 Copy 13_google-pixel4-clearlywhite-portrait.png
iPhone 8 Copy 18_google-pixel4-clearlywhite-portrait.png
Welcome_google-pixel4-clearlywhite-portrait.png

TRANSFORMATION FLOW: BRIDGING TO BUSINESS MODEL

Aligned with the ARitize360 business model, the design intricacies of the transformation flow were meticulously crafted. Following the completion of product recording, users would upload their recording to our servers for rendering. Upon completion, a notification on their mobile device would prompt users to return to the content management website for asset viewing and purchase. Unfortunately, technical limitations prohibited the display of the 3D asset within the app, necessitating redirection to the website.

Within this flow, my focus was on providing clarity to users regarding which captures needed uploading, those already uploaded, and articulating the subsequent steps. Ensuring a seamless experience, I designed additional sections within the app – "How it works," "Capture Techniques," and "Contact." These features aimed to support clients in optimizing their capture results, considering the specific challenges posed by the technology, such as the inability to capture shiny objects, symmetrical items, recording time constraints, and precise camera angles.

Acknowledging these technical constraints, a strategic refocus was initiated towards capturing shoes and engaging shoe retailers specifically, capitalizing on the strengths and capabilities of the technology.

Welcome Copy 2_google-pixel4-clearlywhite-portrait.png
Welcome Copy 9_google-pixel4-clearlywhite-portrait.png
Welcome Copy 10_google-pixel4-clearlywhite-portrait.png
Welcome Copy 6_google-pixel4-clearlywhite-portrait.png

SEE ARITIZE360 IN ACTION

MEASURABLE IMPACT AND RESULTS

Post-implementation, ARitize360 demonstrated a transformative impact on various facets of e-commerce, aligning with industry trends and offering tangible benefits to sellers.

Enhanced Customer Engagement:

The incorporation of 3D models and Augmented Reality (AR) into the ARitize360 app resulted in heightened customer engagement. Sellers experienced an increase in the time customers spent interacting with product listings, fostering a deeper connection between shoppers and their offerings.

Reduced Return Rates:

By providing consumers with immersive 3D representations of products, ARitize360 aimed to mitigate the risk of mismatched expectations. Early indications suggest a potential reduction in return rates as customers make more informed decisions, confident in their understanding of the product's features and dimensions.

Increased Conversion Rates:

The integration of 3D models and AR experiences within the app led to notable improvements in conversion rates. Shoppers, equipped with a clearer understanding of the products through interactive visuals, were more likely to convert their interest into purchases.

Improved Brand Perception:

Sellers utilizing ARitize360 found that the adoption of innovative technologies positively influenced brand perception. The app's incorporation of cutting-edge features enhanced the brand image, resonating particularly well with tech-savvy consumers and contributing to increased brand loyalty.

Extended Time Spent on Product Pages:

ARitize360 succeeded in capturing the attention of online shoppers, significantly extending the average time spent on product pages. The interactive nature of 3D models and AR experiences provided sellers with valuable opportunities to showcase product features and benefits, further influencing purchasing decisions.

THANK YOU

 

Thank you sincerely for investing your time in exploring my journey and the intricate process behind the design and implementation of ARitize360. Your engagement in this narrative reflects a shared enthusiasm for the creative evolution that defines impactful design endeavors. If you have any further inquiries or would like to delve deeper into any aspect of this project, feel free to reach out. Once again, I appreciate your time and consideration.

bottom of page