Product Designer
Adobe x Instagram
CreativeJam
Summer 2021
Adobe XD
Prototyping
User Research
Branding
@Angie Yang
Butik was the submission for Adobe CreativeJam x Instagram, a UX design competition hosted by Adobe. Students are given one week to create a product in Adobe XD in response to a given prompt. Butik was chosen as one of the top ten finalists for the competition of approximately 200 submissions.
With a layout reminiscent of social media along with a robust shop search function, consumers are able to discover small businesses as well as follow the businesses that they like. Small business owners are able to curate their shop page and interact directly with their customers utilizing the live function.
.gif)
The consumer-side is inundated with big business ads making it difficult for consumers to find small businesses to purchase from. Not only that, consumers often have concerns about the quality of small business products.
Small businesses have difficulty competing with big businesses' resources. One of the major perks of small businesses is a personalized connection with customers, something that is difficult to achieve online.
Based on the user research, the platforms that our user base currently uses to discover and purchase from small businesses are Etsy, Instagram, and Facebook.
The most small business oriented platform is Etsy, but it's focus is arts and craft. Instagram has been good with giving visibility to small businesses but that requires small businesses to also become content creators. They would also have to compete with a lot of larger brands on Instagram. Facebook has Facebook marketplace which is often good for making purchases from individuals based on location. But, it's UX is often difficult to use and there is no systematic way for small businesses to be on the platform.
With the advent of Covid-19 pandemic, many shops have made the transition of going online. But with the inundation of online shops, it has become increasingly difficult for small businesses to compete with the marketing resources of larger corporations in the online space.
Small businesses have difficulty finding their potential consumers. Consumers also have a difficult time finding small businesses that they care about.
Online businesses have trouble making the personal connection with their customers that they would normally have when customers shop in-person. This makes it difficult to provide tailored customer service on an online platform.
The goal of our lo-fidelity drafts was primarily to outline the pages we needed to create for the prototype and the content on each page.
Our preliminary sitemap gives a general look at the original flow we decided on for our project. This sitemap has since changed, but the basics are still the same.
Here are some of our basic wireframes that we created before we dived into specifics. These wireframes outlined the content we wanted on each page as well as the general layout, using simple boxes and circles.
We wanted to create an easily recognizable brand for butik. Contrasting salmon pink and dark slate gray creates an eye-catching color identity. With the logo, we went for a "b" that imitates a shopping cart. For the typography, we chose clean type for both the logo and text, to convey the sophistication of the shopping experience.
For our final product prototype, we included a number of features, including an extensive tutorial for simple onboarding, discover feature to find new businesses, and an innovative live feature to bring a personal aspect to online business. View our final prototype here.
For our final product prototype, we included a number of features, including an extensive tutorial for simple onboarding, discover feature to find new businesses, and an innovative live feature to bring a personal aspect to online business. View our final prototype here.
New users are met with a robust (skippable) tutorial on navigating the application, though the application itself is pretty self-explanatory.
Users are able to discover new products in the "Discover" tab and discover new shops in the "Marketplace" tab. Products and shops are sortable by location, type, ratings, and price.
Users can follow the shops that they like in order to track new product releases and news about the shop. On the shop page, users can see all the products sold by the shop as well as previous ratings and read about the history of the shop.
During shop office hours, customers can interact with employees and the owner directly through butik's innovative "Live" function. This function brings the personalized connection previously only found in-person onto an online platform.
Out of 100, our project scored an 89, which earned us a spot in the finals (of ten other projects). As seen above, the judges graded based on audience awareness, innovation, user experience and design.
See the rubric and scoring sheet (our team name was The Super Cool Bros).
The work for this project was split pretty evenly between me and my partner. Specifically, I created the tutorial, the product, shop, discover, marketplace, and live pages, while my partner created the sign up flow, checkout and logo. I also presented the prototype to the judges during the CreativeJam finale.
Because of the limited time we were given, we were unable to do extensive user research for problem identification and user testing after the prototype was created. Thus, next steps, if I were to continue to pursue this project, would be to conduct user testing to determine (1) whether the problem was identified correctly and (2) whether the proposed solution adequately addresses the issue at hand.
In terms of design, the design of the prototype could be further simplified and streamlined to provide a more straightforward user experience. For example, it might be a bit confusing for users to use the product content feature and distinguish between discovering products and discovering shops. Furthermore, it might be beneficial to create a more elaborate checkout and profile system.
