Leveraging AI to Design the User Experience of a Digital Business Card Product
Project Overview
To design a Shopify theme for Levl, a brand concept in the digital business card market using Generative AI.
My Role
I partnered with Sprintfolio as the sole designer.
Conducted client and market research using Generative AI.
Performed competitive research and a heuristic evaluation of a major competitor.
Defined key performance indicators (KPIs).
Designed the Shopify theme, created graphics, and wrote content.
The Challenge
To design a Shopify theme that meets the needs of professionals in the high-end automobile industry.
Levl's primary product is a stainless steel business card that links to a digital wallet profile. These cards are available for purchase as kits, with the option for large corporate orders upon request.
Additionally, this project involved experimenting with generative AI for conducting client and market research. I used ChatGPT and fact-checked my findings through traditional research methods.
Solution
I concentrated on highlighting the app's security features, such as password protection, and the efficiency of the digital business profile through engaging copy and consistent usability testing. Given the limitations of Shopify's product page features, I created separate pages for products available for immediate purchase and for bundles available upon request.
I used strategic site research copy to target user needs and designed a store that addresses their pain points. The outcome is a store that supports the client's objectives and meets the needs of the target demographic.
Password: 1234
Client
Sprintfolio
Levl
Tools
Shopify and Figma
Project Duration
3 Weeks
Overview
-
Secondary Research with Chat GPT
Condensing Research Findings
Challenges and What Didn’t Work
Fact-Checking
-
Creating a Moodboard and Style Guide
Designing the Shopify Theme
Challenges and What Didn’t Work
-
Research Insights and Themes
Implementing Feedback
-
Prototype of Shopify Theme
Reflections
Next Steps
-
Secondary Research with Chat GPT
Condensing Research Findings
Fact-Checking
Experimenting with Chat GPT: Researching the Target Audience
I used Chat GPT to conduct client research on automobile salespeople. I began my research with the current state of the Luxury Automobile Market and the goals of the professionals in this field.
Learning Goals
Research Insights
I dissected my findings in the areas where Levl could increase its value offering. The ability to showcase industry knowledge, facilitate networking opportunities, and the ability to build social proof were the most important goals for professionals in this field.
What Didn’t Work: Discovering the Limitations of Chat GPT
Chat GPT prompt I used and its response.
I wanted to learn if generative AI could guide market research in the right direction. I quickly discovered that Chat GPT was unable to produce a report on recent automobile industry data, as the language model’s knowledge was limited to information available up to September 2021. This roadblock was recently fixed for paid users, which goes to show how quickly Chat GPT has evolved in the past few months.
I pivoted my market research to a more conventional method, Google, and found a report by Grand View Research claiming that market growth is being propelled by a growing number of high-net-worth individuals, increased disposable income, and the adoption of EVs.
Fact-Checking Chat GPT
I had some concerns regarding the quality of the information provided by Chat GPT, so I decided to use the same prompt as a Google search to see if I could find any supporting evidence of their data.
I only found one article supporting the information Chat GPT provided. One pattern I noticed was the blog posts and articles on the first page of Google were significantly more detailed and insightful than the information provided by Chat GPT. I got more value from the articles written by professionals in the field because they went into more detail. I used that detailed information to write engaging website copy to target the specific needs of the target demographic.
Differences between the information provided by Chat GPT vs the blog post I found on Google.
-
Moodboard
Style Guide
Designing the Shopify Theme
Challenges and What Didn’t Work
KPIs
To track this project’s success, I focused on the areas where I could use Shopify’s analytics tools for tracking.
Product Requirements:
The stainless steel cards are sold as kits, with the starter “Entrepreneur Kit” including a choice of wearable accessories including scannable rings and phone stickers.
Large orders known as “Corporate Bundles” are only available upon request, as customization is available.
The theme should highlight the unique features of the card's app and how it’s used to enhance the user experience of the product.
Theme must incorporate black and silver.
Mood Board & Style Guide
The client wanted the Shopify theme to convey luxury, elegance, and exclusivity to appeal to a luxury enthusiast customer.
I gathered inspiration from the aesthetics of online finance gurus, self-improvement content creators, and the first American paperback edition of the 1991 novel by Bret Easton Ellis, American Psycho.
Style Guide
I followed the client’s request for a black and silver theme. Font decisions were made to combine a minimalist font (Optima) balanced with a contemporary font (Catamaran) to give the website more versatility.
What Didn’t Work: Design Challenges and Platform Restrictions
Challenge #1: Shopify’s Product Page Limitations
One of the first challenges I encountered was Shopify’s limitations when selling products as kits.
The client wanted the “Entrepreneur Set” product to include the option to select an add-on accessory. I was unable to create one product page where the user could select from a variety of add-ons due to the rings needing a size selection. I experimented with a few plugins but I was unable to make this specific request work.
I solved this by creating one product page for each variety of the kits. Luckily, there were only two options so this was rather easy to solve.
My Solution
Each product page had it’s own “kit” name and a product picture that would effectively communicate the difference between each of them.
Challenge #2: Limited Assets and Product Features Provided
I received limited information regarding the technology of the card and the wearables’ materials. The product pictures were in poor angles, which increased the time spent editing. Due to the lack of variety, I spent a lot more time than I wanted on fixing the images to make them look cohesive and up to the standards of an e-commerce store.
My Solution
I found a mockup of an iPhone with a phone sticker on the back which I edited to look like a scannable phone sticker.
I was provided with a mockup of the card which had the old brand spelling and logo. I chose to keep the name as it was challenging to change it on Figma.
To achieve my version, I isolated the card and removed the background. Then I added some shadows which enhanced the card's dimension, adding depth to the overall design.
-
Research Insights and Themes
Before and After Implementing Usability Feedback
Research Insights & Themes
Are My Designs Successfully Addressing the Client’s Needs?
I conducted usability testing with 5 users to further test how my designs were communicating my and to find areas of improvement.
Although testing was not a requirement for this project, I found it imperative to speak to users and test my designs before moving forward.
Theme 1: Users Need More Persuasive Content To Adopt a New Technology.
Data suggested the early and late majority group of users wanted to know why they should invest in new technology. Users wanted more information on the benefits of switching from a traditional business card.
Solution: Improve Landing Page Content
I was able to increase opportunities for discovery and brand awareness by improving the content, as users were previously confused about the product being sold and what the benefits of a digital business card were.
Theme 2: Improving the Corporate Set Ordering Experience
Users shared confusion about how the Contact Form was displayed and how little guidance was provided for people wanting to order the Corporate Set.
Solution: Redesign the Corporate Page
I focused on the layout of the Corporate Teams and Landing Page. I increased visibility on the FAQ by changing out the drop-down menu to a dedicated space where I included brand-related icons. To better guide users, I improved the content on the contact form.
-
Prototype
Reflections
Next Steps
Prototype
Password: 1234
Reflections
I thoroughly enjoyed working on this project and experimenting with Chat GPT as a research assistant was an interesting experience. While I was impressed by Chat GPT's speed when compiling data, I’m glad I took the time to fact-check, as it gave me perspective into the quality of data I could find on my own as opposed to what I could get with Chat GPT. This experience provided me with a more realistic perspective on AI's current capabilities and areas where further development is needed.
Next Steps
I would like to improve the portal where the digital business card is created. Additionally, I would add more customization features to make the product competitive in today’s market. I would then advise the client to create content about the technology of the card to increase website visitors and start developing the brand’s tone.