top of page

The Dark Workshop
 

Problem Statement
To create an E-Commerce website to showcase and sell my artwork. The goal was to construct an online art store and offer various design related services. 
 

Paint Brushes

Role

I independently conceptualized, designed, and developed the website, showcasing my artwork and utilizing my skills in user research, design thinking, and web development. From conducting user interviews and creating personas to crafting wireframes, and implementing responsive design, I navigated through all stages of the project. I wanted to explore roles as the designer, researcher, and developer to demonstrate my autonomy, passion, and expertise.

Define
 

Overview

The Dark Workshop is a website that showcases and sells a diverse range of artwork, including digital illustrations in the form of posters and stickers, as well as physical acrylic paintings. This independent project was developed as part of the Google UX design course on Coursera, with the primary objective of creating a portfolio-worthy project while gaining practical experience in user research, prototyping, and website development using Wix.

define

Why this project?

The motivation behind embarking on this project was multifaceted. Firstly, the intention was to create a unique platform to display and market my creative work.

Secondly, participating in the Google UX design course served as an opportunity to enhance skills and knowledge in user-centric design principles. The project provided an avenue for practical application of the course learnings, enabling me to dive into the realm of user research, information architecture, wireframing, and responsive design.

Duration

January 2021 to March 2021  (3 Months)

Software used

Adobe XD, Photoshop, Wix, Miro.

Research

 

Research Overview 
“It is a capital mistake to theorize before one has data.” ~ Arthur Conan Doyle.

To ensure the project's success and align it with user needs and preferences, comprehensive user research was conducted. Interviews were carried out with potential art enthusiasts and buyers to gain insights into their interests, motivations, and purchasing behaviors. This research phase aimed to understand the target audience's expectations, preferences, and pain points regarding art platforms, which helped shape the design and functionality of The Dark Workshop. The findings revealed a positive inclination towards buying from such platforms, highlighting a potential market for the website.

The primary focus of the research was to establish brand recognition rather than immediate revenue generation, leading to a concentrated effort on developing powerful and vigorous marketing and advertising strategies.

 A thorough analysis was conducted to evaluate various site builders, including Wix, Shopify, BigCommerce, and SquareSpace. Parameters such as pricing plans, ease of use, freedom of customizations, and SEO services were taken into consideration during the evaluation process.

Based on the research findings and analysis, Wix emerged as the preferred website builder for its user-friendly interface, customization options, and overall suitability for The Dark Workshop's requirements. In addition, Shiprocket was chosen as the shipping partner to facilitate reliable and efficient product delivery.

The research overview presents a snapshot of the conducted studies, emphasizing the interest in purchasing from private websites and the importance of powerful marketing strategies. It also highlights the thorough evaluation of site builders and the selection of Wix as the preferred choice for website development, as well as the partnership with Shiprocket for streamlined shipping services. This research-driven approach lays a strong foundation for The Dark Workshop's success and recognition in the competitive online marketplace.

research

Pain Points 

 

Checkout Process

Users are inclined to lose interest if the checkout process is too tedious or confusing. 
 

Transparency 

Straightforward return policies, terms and conditions etc. are expected.

Customer Service

Users tend to leave bad reviews if the customer service does not meet expectations. 

Solutions :

  • A quick checkout process with saved addresses and payment options to reduce the time taken.

  • Chat box on all pages to get in touch with the customer service.

Ideate

ideate

Moodboards  help me decide the general theme and ideate about the new layout styles and quirky ideas.

SharedScreenshot 1.jpg
SharedScreenshot 2.jpg
SharedScreenshot.jpg
pinterest.jpg

Brainstorming session

Personas

Indian Woman

Kiara Mehta 

25 years old

Fashion Designer

Single, lives alone.

Delhi, India.

“I want to explore this city and am excited for the new experiences.”

Kiara is a Fashion major from Delhi and they just moved to Bangalore to work. They love to watch horror movies. They will be spending the next few years in this city and found an amazing apartment to live in. They wish to buy paintings and posters to spruce up the place. As they just started their new job, they cannot spare time to go shopping yet, hence, they have ordered everything including the furniture from online stores.

Goals

  • To set up their new apartment.

  • To excel at their new job

Frustrations

  • “I have to make a good impression at my new job and usually stay back late”

  • They don’t have time to physically go and buy furniture and decor for the new apartment.

User Story

Kiara is an independent, busy person who needs to buy paintings and posters from an online store because they want to decorate their new apartment.

Sitemap

sitemap ss.jpg

I developed a site map, which visualized the structure and organization of the website. This helped me plan and design a logical and intuitive navigation system, ensuring that users could easily find and access the different sections of The Dark Workshop.

design

Design

Wireframes & low fidelity prototype  

wireframes.jpg

During the wireframing process, I utilized Adobe XD to create monochromatic wireframes for The Dark Workshop. This phase was instrumental in honing my skills and familiarizing myself with the software. Adobe XD proved to be an excellent tool for designing low-fidelity representations of the website's interface, allowing me to iterate quickly and efficiently. By focusing on the layout, structure, and user flow, the wireframes provided a solid foundation for the design, enabling me to visualize the overall user experience and make necessary adjustments. This practice not only strengthened my proficiency in Adobe XD but also facilitated a better understanding of the project's navigation and interaction patterns. Ultimately, the wireframing process played a crucial role in refining the website's design before moving on to the high-fidelity mockups and interactive prototypes.

To view the low fidelity prototype, click here.

Responsive web design

Samsung Galaxy S10 – 1.png
Samsung Galaxy S10 – 1.png
Samsung Galaxy S10 – 2.png

Recognizing the importance of catering to users accessing the website on various devices, I took on the challenge of creating a mobile-friendly version of the site. This involved implementing design principles and techniques that ensured optimal user experiences across different screen sizes and resolutions. By considering factors such as layout adjustments, font sizes, and image optimization, I crafted a responsive design that adapted seamlessly to different devices, including smartphones and tablets. This process not only enhanced the accessibility and usability of the website but also showcased my ability to create a cohesive and engaging user experience across multiple platforms. Exploring and implementing responsive design principles for The Dark Workshop allowed me to expand my skill set and deliver a website that could be easily accessed and enjoyed by a wider audience.

Logos and Colors

logo 1.jpg
logo 2.jpg
logo 1.2.jpg

Different versions of the initial logos..

Primary Colors

logo final.jpg

Final version

Accent Color

White

#FFFFFF

Grey

#999999

Black

#000000

Teal

#3FEODO

To ensure a cohesive brand identity for The Dark Workshop, I meticulously curated a color palette and developed various versions of the logo. These elements were instrumental in creating a comprehensive style guide that aligned with the brand's aesthetic. The website design embraced a dark mode theme, featuring a black background that exuded a sense of sophistication and mystery. Text and product cards were elegantly presented in shades of grey and white, ensuring readability and visual clarity. To provide visual interest and draw attention to key elements, such as highlights and buttons, a vibrant teal color was selectively incorporated. This carefully curated color scheme and design approach resulted in a visually striking and unified brand experience for The Dark Workshop.

High Fidelity Prototype

final hi fi.jpg

The high-fidelity designs for The Dark Workshop underwent a short but impactful usability study, yielding positive results. Leveraging Adobe XD, I had the opportunity to master the software and bring my design vision to life. Notably, a floating menu was incorporated into the signup page, enhancing its visual appeal and user experience. To showcase the authenticity of the products, I utilized my own photography, featuring them prominently in the product cards. Once the final prototype was completed, I meticulously designed the website from scratch using Wix, opting against templates to ensure a unique and tailored experience for both web and mobile users.

To view the prototype click here.

Evaluation

evaluation

Takeaways

Impact:

  • The Dark Workshop had a positive impact on users by providing them with a visually captivating and user-friendly platform to explore and purchase artwork. The intuitive navigation, responsive design, and attention to detail ensured a seamless and engaging user experience.

  • The Dark Workshop project had a profound impact on my professional growth and development as a designer and entrepreneur. It provided me with hands-on experience in all aspects of the design process, from user research to website development.

What I learned:

  • Conducting user research and interviews provided valuable insights into the target audience's preferences, needs, and motivations, shaping the design decisions and enhancing the overall user experience.

  • Familiarizing myself with Adobe XD expanded my skill set and proficiency in designing visually captivating and user-friendly interfaces.

  • The importance of responsive design and the adaptation of the website across various devices highlighted the significance of creating a seamless and accessible user experience.

  • Creating a comprehensive style guide, including color palettes and logo variations, emphasized the significance of cohesive branding and its impact on establishing a strong brand identity.

  • Developing the website from scratch on Wix reinforced my knowledge of web development principles and enhanced my ability to customize and optimize the user interface.

  • Managing the project independently allowed me to refine my time management, problem-solving, and decision-making skills while taking ownership of the entire design process.

Next Steps

  • To formulate marketing and advertising strategies. 

  • To launch the website once all the products have been uploaded.

  • Devise packaging designs & refine shipping prices. 

THANK YOU for taking the time to view my work. Please feel free to get in touch or leave some feedback!

Visit the store and place an order to show your support! 

www.thedarkworkshop.com

bottom of page