web design
motion design
development

Visiona

01.

Who is Visiona?

Visiona specializes in Artificial Intelligence solutions for e-commerce, providing immersive experiences like Virtual Try On with augmented reality to boost sales conversion rates.

The company offers innovative photoshooting services, eliminating the need for studios or models while delivering professional images.

Additionally, Visiona provides a 3D product studio for item customization, enhancing image variety to better meet brand needs.

02.

Person

A persona in user-centered design is a fictional character created to represent a type of user who might use a website, brand, or product in a similar way.

Emily Carter

“I want my customers to be able to try on clothes online, using their cell phone camera, so they feel more confident when purchasing.”

38 years

Austin - TX

Complete Higher Education

Married

Urban Bloom

About:

Emily Carter, a 34-year-old woman living in Austin, Texas, is the owner of Urban Bloom, a women’s clothing store that started as a small local business and now operates primarily online. With an entrepreneurial spirit and a passion for fashion, Emily dedicated herself to creating a brand that offers modern and affordable pieces for women seeking style and comfort.

With the growth of online sales, Emily noticed a recurring challenge: many customers hesitate to buy clothes online because they can’t visualize how the pieces would look on their bodies. This creates insecurity when making a purchase, increases return rates and impairs the shopping experience.

Determined to improve her e-commerce, Emily is looking for technological solutions to offer a more engaging and practical shopping experience. Her main idea is to implement a virtual try-on tool on her website. This feature would allow customers to use their phone’s camera to visualize, in real time, how the clothes would look on their bodies. She believes that this would not only increase shoppers’ confidence, but also strengthen the connection between the brand and its customers, creating a unique and personalized shopping experience.

Emily is already exploring options for augmented reality-based technologies and looking for partners who can help her integrate this innovation into her store’s website. For her, the goal is not only to sell more, but to offer a shopping journey that eliminates barriers and provides more security for her customers.

With her bold vision and focus on innovation, Emily Carter is ready to transform Urban Bloom’s e-commerce into a reference for digital experiences in the fashion industry.

Ethan Sullivan

“I want a tool that lets me create images of models wearing my clothes and easily change the colors, all from a single photo taken with my phone.”

41 years

Denver - CO

Complete Higher Education

Married

Peak Threads

About:

Ethan Sullivan, 41, lives in Denver, Colorado and is the owner of Peak Threads, an online-only menswear store. Passionate about fashion and the convenience of e-commerce, Ethan built his brand with the goal of offering stylish and versatile pieces for modern men.

Despite his dedication, Ethan faces a major challenge: he does not have enough financial resources to hire professional models and photographers to showcase his collections on the website. This limitation affects the presentation of his products, making it difficult to show how the clothes actually look on the body and reduce customer doubts. In addition, his store works with several color options for each product, which further complicates the process of creating images for all product variations.

Ethan dreams of finding a tool that will revolutionize the way he presents his products. He is looking for a solution that will allow him to take a single photo of a piece of clothing with his cell phone and, from that, generate images of different models wearing that outfit. Additionally, he wants to easily customize the colors of the pieces in the images to match the available inventory. With this technology, Ethan believes he could save time and money, as well as elevate the visual standard of his store, providing a more professional and trustworthy experience for his customers.

As he researches automated editing and artificial intelligence technologies, Ethan remains firm in his vision: to make Peak Threads known not only for the quality of its pieces, but also for providing a visually engaging shopping experience, even with limited resources. He knows that innovation and creativity are his greatest allies on the path to success.

James Mitchell

“I want to offer my customers an interactive experience where they can view and customize accessories in 3D on my website before purchasing.”

28 years

Los Angeles - CA

Complete Higher Education

Single

Chic Vibes

About:

James Mitchell, 28, is the owner of Chic Vibes, an online store specializing in men’s accessories such as hats, glasses and jewelry. Located in Los Angeles, California, James has always had an innovative vision for his business and, over time, decided to focus exclusively on accessories, realizing the great potential for personalization and style that these items offer to his customers.

Despite his success, James realized that presenting his products in traditional photos was not enough to highlight the quality and design of his accessories. He knew that modern consumers look for more than just a simple image of a product, so he is looking for solutions that provide a more immersive and interactive experience.

James dreams of implementing a 3D visualization platform for his accessories. The idea is that, from a few high-quality photos of his hats, glasses and jewelry, he can generate realistic 3D models that can be viewed from different angles on the store’s website. He also wants these 3D models to be fully interactive, allowing customers to customize the colors and finishes of products based on the options available in stock, which would make the shopping experience even more personalized and engaging.

With this innovation, James believes that Chic Vibes can offer a unique shopping experience, helping its customers visualize how accessories would look in different contexts and styles. He is convinced that this technology will not only increase sales, but also customer satisfaction, as they will have greater confidence in their purchases, seeing the products in accurate and detailed way.

04.

Typography

05.

Colors

Colors are a fundamental element of UX/UI design as they play an important role in how users perceive and interact with a digital product. The choice of colors was based on a WCAG 2.1 contrast system.

Base

These are base black and white color styles to quickly swap out if you need to.

AAA 21:1
White
#FFFFFF
AAA 20.19:1
Black
#050610

Gray

Gray is a neutral color and is the foundation of the color system. Almost everything in UI design, text, form fields, backgrounds, dividers are usually gray.

AAA 10.2:1
25
#F4F5F6
AAA 10.01:1
50
#F9FAFB
AAA 9.49:1
100
#F2F4F7
AAA 8.84:1
200
#EAECF0
AAA 7.09:1
300
#D0D5DD
AA 4.06:1
400
#98A2B3
AAA 4.97:1
500
#667085
AAA 7.68:1
600
#475467
AAA 10.46:1
700
#344054
AAA 14.7:1
800
#1D2939
AAA 17.74:1
900
#101828

Primary and secondary gradient

Gradients were chosen to be the main colors of this project, they are used in titles, illustrations, icons.

Primary
133deg
#0894FF
#C959DD
#FF2E54
#FF9004
Secondary
180deg
#D8ECF8
#98C0EF

Categories

Gray is a neutral color and is the foundation of the color system. Almost everything in UI design, text, form fields, backgrounds, dividers are usually gray.

A 4.42:1
Eyewear
#0076DF
A 2.91:1
Jewelry
#FA6B37
A 1.81:1
Electronics
#2FDC74
AA 5.8:1
Footwear
#8F2FDD
A 3.73:1
House & Decor
#F62C86
A 1.78:1
Accessories
#2BD3F8

06.

Wireframes

I turned my initial ideas into some low-fidelity wireframes to open up the field of vision. Below you will find highlights of some wireframes for the user flow.
Initially, I had planned to structure the page by presenting all of the product’s features in specific sections. However, after the first review of the draft with the client, he suggested that some features be grouped together to make the page more concise.

07.

Storyboard for animations

Within each section, instead of a static image of the product, the client requested the inclusion of animations. The goal is to make the presentation of each feature more dynamic and illustrate, in practice, how they work. To meet this demand, we developed specific storyboards for each feature: Virtual Try On, 3D Playground, Photoshooting, Platform.

Storyboard

3D Playground

Transforming photos into 3D models effortlessly with just a few clicks. Simply uploading photos, customizing colors and details, with the platform taking care of the rest, delivering a stunning and personalized 3D visualization of the product, ready to use.

Storyboard

Virtual Try On

Virtual Try On allow the customers to virtually try products in 3D, boosting confidence and reducing returns. The technology enhances user experience, highlights your brand, and ensures that every purchase is a perfect choice.

Storyboard

Photoshooting

Enjoy the ease and flexibility of creating stunning, personalized photos without the hassle and cost of traditional production. Use models and backgrounds from anywhere with just a few clicks.

Storyboard

Photoshooting in action

Enjoy the ease and flexibility of creating stunning, personalized photos without the hassle and cost of traditional production. Use models and backgrounds from anywhere with just a few clicks.

Storyboard

Platform

Take photos against a simple background, upload them to the platform, and let the technology handle the rest. Transforming images with customized scenarios and models, adjusting them to reflect exactly what is needed, and delivering professional and impressive results with ease.

08.

High fidelity

Starting with the home page, visitors have immediate access to Visiona’s main products, as well as social proof that reinforces its credibility. Below, the features and platforms available for integration are presented.

09.

Demo page

The Demonstration page is dedicated to an interactive library, where visitors can explore how the Visiona platform works in practice. Here, visitors can select products and test them directly using augmented reality resources, providing an immersive and practical experience.

Thanks for seeing until here!