Frankly Wearing

Redesigning the User Experience & User Interface of the website

As a student and an aspiring designer, I am still exploring the huge world of Graphic Design and all the fascinating fields it houses. This project was my introduction to the field of User Experience and User Interface Design. Initially, I was awestruck by the vastness of this field and I still consider it unfathomable in so many ways.

Collaborated with my friend Parth R. Dake for this project! (cheers mate!)

What is the project?

The project brief was to take an online brand/company/corporate platform, study their present stature, existing forum (and existing customer base) and their vision. Then to use a web design process and an understanding of UX & UI to add/improve essential features to their existing forum.The main aim of the brief was to recreate their platform for a better and more engaging user experience,with the help of research and analysis.

The platform I have chosen is an Indian merchandise website called Frankly Wearing.

What is Frankly Wearing?

Frankly Wearing is a merchandise website started by a few friends from University of Delhi as a means of catering to the needs of fellow college students who were constantly looking for cheap alternatives for purchasing high-quality custom merchandise. After more than a 100 delighted college-based clients, they decided to take it up a notch and began catering to corporate clients, with whom we deal in a wide range of customized products.

Presently, along with dealing in bulk orders for customized merchandise, they have this retail platform where content creators can launch their official merchandise without having to worry about the manufacturing and logistics.

The Frankly Wearing website mainly focuses on supporting and providing a platform to content creators of all types.

First impression of the Website

What do you see on the site?

• The site has a very average and spaced out look.
• The first thing you see is a big teal colored banner that says ‘Official Merchandise by Creators.’

• There are links to the pages for products, the selling information, and the creators’ information as to their main header tabs with your cart, and your account also being in the corner of the header.
• The homepage shows an overlook of the merchandise sold on the website.

• The page has a lot of negative white space.
• There is a Filter and Sort panel on the left side of the page.
• The Products tab takes you to a page where all products are displayed and the types of merchandise are stated.
• The Sell tab takes you to a page regarding the selling information, which in turn has two page links to a form (to be filled in order to become a creator).
• The Creators tab on the page has a drop down menu with links to the pages ‘Become a Creator’ and ‘List of Creators’.

• The ‘Become a Creator’ page has information regarding a creator and a link to becoming one.
• When the creator account is ready, the creator can put up their content on the site. They can either upload their original work to the site and place it on a mock up or ‘customize’.
• The Customize page lets anyone create their own design using basic text,shapes available on the website.

Website Analysis

SWOT Analysis
Strengths

Frankly Wearing has some strengths that they have played to quite well. One of it’s main strengths is that it puts itself forward as a platform for independent content creators who want to reach the masses with their content as merchandise. Signing up is free of cost for anyone who wants to register themselves as a creator. This ‘open door’ feature is what has led to them having a huge amount of creators and almost double the amount of content and merchandise. When it comes to the merchandise, it is affordable and good quality and also gives the creator to choose the margin amount they will receive on their merchandise.

Weaknesses

When you open the website, there is no proper indication as to what the website is exactly about or what it does. You realize their goal much later once you explore more of the website.

Next, due to the fact that the website is free and requires no verification to become a creator, there is a huge amount of content as well as creators on the website. This, in turn, has caused a lot of good and original content to get lost in the hundreds of pages worth of content/products. Another problem is the low amount of original content. Due to the lack of regulations, it is possible to upload any existing picture, meme or even someone else’s content. Thus, a whole lot of plagiarism takes place.

Another issue with the website is that there is no proper segregation of content and information which causes some problems in what the website wants to communicate and what the customer understands.

The website’s navigation is somewhat confusing and the number of redirecting pages can end up irritating the customer.

One of the main issues with the website is that it lacks the fun and attractive element in terms of visuals and the UI to be a young and hip stop for merchandise for the young generations. The website is not eye-catching.

A few other weaknesses:

• The website has a poor filtering mechanism. There are some filters which are not applicable to the type of content on the site.
• There is no proper use of grids, and a lot of space has been wasted.
• The overlook of the products is very average and the mock ups are very bad.
• The payment options in the website for the creator as well as the customer are fine, but they can be selected only one at a time which can lead to payment issues sometimes.

Opportunities

The website has huge opportunities in terms of being a popular merchandise website for the new generation. It is very new and basic which gives it the opportunity to adapt new and popular trends very quickly. New Visuals and an improved UX and UI can hugely help the website further its reach and gain popularity. This will also enable them to expand their creator reach and also be really popular among certain age groups because of their affordable merchandise and also because of the original content.

Threats

Content plagiarism is one of the major threats the website faces. Also, the website is free of any costs which may cause misuse of the site. Then, because of the current look and feel of the website, customers may not find the website attractive which may cause them to not return to the site. Also, a lot of content remains unrecognized, due to which there may be a reduction in the number of creators who want to upload their work. This may even cause existing creators to take down their content.

Competitor Analysis

There are a huge number of competitor websites for Frankly Wearing, some of which are Society6, Neon Earth, 21 Art Democracy and Swag Swami. While Society6 and Neon Earth are slightly different from Frankly Wearing, 21 Art Democracy, Swag Swami and Frankly Wearing are pretty similar and also work in a similar manner.

In terms of overall look and feel i.e. the UI, 21 Art Democracy and Swag Swami both have a good look. But out of the three, 21 Art Democracy properly conveys the message of selling art by the creators.

When it comes to varieties of merchandise, Swag Swami has the widest range followed by 21AD and then comes Frankly Wearing. Along with this, Swag Swami has linked up with Amazon India to increase its reach and 21AD ships to Europe, UK, USA and Canada. Frankly Wearing ships only in India.

Stakeholder Profiling

We identified the three main stakeholders of the platform as the owners, the consumers and the content creators. We already know that the owners are university students, and then we went on to create persona profiles of our consumers. The profiles are made based on the target audience of the website as stated by the owners and also on reviews given by various customers.

Main Problem Areas

• One of the main problems the website has is that when one opens the website, it fails to convey its purpose. At first look, there is no indication of what the website is actually about.
• Another problem about the website is that it looks very dull and unattractive. It may even be uninviting to people who are visiting the site for the first time.
• The navigation of the website is slightly confusing and also gets repetitive a lot of times.
• There is no proper segregation of content or even a proper filter to help the customer get what they are looking for.
• There is a huge amount of content on the website which has caused a lot of original and great content to get lost. Also there is no segregation between the artist’s original content and content made on the website.

Proposed Solutions

• To give the website a proper identity and to convey its goal to customers in a proper and understanding manner. To have information arranged in a manner in which it is easy for the customer to understand the website.
• To make the website hip and attractive for the customer and to keep it engaging. To improve the color palette, images and almost all other visuals and interactions on the website.
• To simplify the navigation of the website and make it interesting and engaging for the customer.
• To properly segregate the content according to relevant filters and especially have a segregation between original content and content created on the website.
• To increase the variety of merchandise and also introduce offers (sales, discounts).
• To add a few more payment/monetary options (PayPal to widen reach and Website currency). To also allow the creator and customer to select more than one payment method.

Redesigning Process

The redesigning process started with picking the website apart and getting a sense and understanding of their existing UX and UI. The first step of the process was to determine our information hierarchy followed by figuring out the basic navigation flow.

The basic navigation flow consists of the main and major navigations of the website pages. The creation of the navigation flow was almost entirely dependent on the Information Hierarchy.

After the navigation flow, we started creating our wire frames based on it. The wire frames show the division of information and content into different pages of the website and also the basic layout of the website.

The last step of the process in our project was to create a basic prototype of the redesigned website. We have created some of the main pages and navigation of the proposed design.

Here’s a link to the interactive prototype (desktop version)!

This project was one of the most interesting journeys I’ve been on with something new to learn at every step. And honestly, nothing could have been a better introduction to the field of User Experience and User Interface Design. This was definitely a challenging project, but what’s a project without a challenge, right?

This was a collaborative project by :