Knitters United – A Website Design

A website for knitting enthusiasts who come together for a good cause.

Overview

Many crafters have a stock of material that collects over time. Our goal for Knitters United was to create an online community for knitters to help them use their extra supplies for a good cause.

Role/Team

Working with two partners, we acted as UX Researchers, UI Designers, and FE development. My role included:

• Research Lead
• UX Writer
• FE Coder
• Project lead

Project

Our goal was to design and code a responsive webpage outlining our user’s journey from welcome/intro to joining a charity project.

Timeline

3 Weeks

Tools

• Figma
• Semplice
• Bootstrap
• GitHub
• Google Suite

The Challenge

• Knitters generally have a stash of extra supplies waiting to be used for a “future” project
  
• They don’t know what type of project to use the material.
  
• They don’t always know what they want to knit or what to do for their next project.
  
• They are always looking for inspiration and are familiar with websites with impactful graphics.

Project Goals

• Create and code a responsive website that allows users to explore the site and join a knitting project.
  
• Create a visually stimulating and easy-to-use navigation system to avoid frustrating users.
  
• Include information on charities and the impact the donation has on the recipient.

The Approach

• Create a website that allows users to join charitable knitting initiatives.
  
• Design a brand identity to be carried throughout the site (including typography and colour palette).
  
• Include a newsfeed on different initiatives including the impact of various charity projects.

01 Research

I Just Want To Knit… With Somebody!

Knitter’s United started because one of our members is a knitting fanatic and in possession of a significant stash of yarn to be used in an “upcoming” project. We all know these people. The crafters who have a collection of material for future possibilities. With this thought in mind, we wondered how might we help?

We Wanted To Understand

We decided to focus on knitting due to its popularity as a hobby in the crafting community.

We began by trying to understand our user. We created our proto-persona, Crafty Cathy, a 31-year-old knitter from Toronto. Our goal for the initial research stage was to discover how someone like Crafty Cathy makes the decision on how to use her existing supplies.

Our research goal was to understand:

• How does she handle her extra material supplies when a project is completed?
• Where does she go to find inspiration for projects?
• What resources is she looking for to help with projects?

The Growth Of The Knitting Industry

We wanted to understand the market a bit more so I took on the challenge to conduct additional research into the knitting industry. I discovered:

And The Survey Says

We created a survey, which we then distributed online on Reddit and to our friends and colleagues. We received 67 responses and discovered:

were between the ages of 18-44

The younger age helped explain the surge in social media for the knitting communities.

found inspiration online

Finding inspiration online was key to creativity regardless of age. Ravelry was the main source for inspiration and free patterns.

felt visuals are what draw them to a project

Users enjoyed clean and vibrant designs with a lot of white space. They felt it offered legitimacy to the website.

purchased yarn in person versus online

This helped drive our decision to not focus on an ecommerce site.

gaveaway their knitting projects

Both the survey and industry statistics indicated knitters giveaway their work. How can we capitalize on this information?

The Interviews

We selected five participants from the survey to interview. We wanted to delve deeper into understanding knitters and their habits towards spare material. Key insights we discovered include:

Knitters are Generous
They knit for their friends, family, and charity. 

They All Have Yarn Stashes
Knitters generally have extra material for possible future use; however, finding small projects to use the material becomes a task in and of itself. 

Knitting is a Social Activity
Knitters enjoy being members of a bigger knitting community.

The Competition

We used the survey and interview research answers to identify some key competitors. We reviewed 8 sites in total. Some websites like Knots of Love and Knitting for Charity focused on knitting for a cause while others like Ravelry and Yarn Inspiration were more general sites that offered patterns and project ideas.

We also looked at additional websites that weren’t considered direct competition, but we felt they would provide inspiration for our project.

Of all the websites we looked at, we gathered the most inspiration and insight from the following 4:

Ravelry was our top-mentioned website. Most of our users visited it to find inspiration and knitting patterns. They had a tab for charity work, but it is not the website focus.

Knitting for Charity is a website that provides tips on how and what to knit for charity, but the site didn’t have a section for discussions or interactions.

Pinterest was our second most mentioned website in the survey. Respondents commented on how they liked the big images and how the different posts inspired their creativity.

GoFundMe was our crowd-sourced inspiration. The site had a clean and simple layout with social share built into every part of the pledge pages.

02 Definition

Meet Noble Nancy

After our research, we worked together to synthesize the data into an affinity map. Key points from the Affinity map were used to pull together one voice and narrative that became our user persona.

Nobel Nancy loves knitting. It’s her favourite hobby. She enjoys social media and sharing her creations online. She is task-driven and finds it hard to be creative without a goal in mind.

Knitting relaxes me after a stressful day. It makes me feel like I accomplished something when I finish a project.

Behavioural Demographics & Drive

• Loves to knit while watching TV
  
• Enjoys spending time with her family
  
• Is active on social media, especially Instagram
  
• Enjoys learning new things, especially with crafting
  
• She spends weekends at flea markets
  
• She is loyal to yarn brands, leaning towards ethical company choices
  
• She is comfortable shopping online
  

Goals & Needs

• Knitting gives her a sense of accomplishment
  
• She is always looking for ways to reuse, recycle, reduce with her
  
• She believes in giving/receiving homemade gifts with meanings
  
• She likes to help others and tries to find ways to help in her own way
  
• She likes websites that are clean, bright, easy to use, and transparent so she doesn’t feel like she’s being scammed
  
• She wants to make connections with other people, especially crafters

Hesitations & Pain Points

• Finds it hard to be creative with no goal in mind
  
• She finds larger projects difficult and prefers quicker knitting designs
  
• Is always looking for reliable resources for project ideas
  

Our Conclusions

During user interviews, we discovered users like the sense of community that comes from knitting.  They enjoy gifting or donating their projects to charities.  We believe by creating a knitting website that showcases small patterns and projects, we can help create an online community devoted to charitable stash-busting initiatives.

This led us to ask the question, how could we create an online environment for knitters where they can help others and be inspired to create? Or more specifically, how could we merge the GoFundMe concept with a site like Ravelry and/or Knitting For Charity and design a platform where users could join charity causes and get inspired at the same time?

We could do this by allowing users the ability to crowdsource donations for good causes, including basic materials and/or finished projects. This would create a platform for individuals and groups to give back while gathering help from the larger knitting community, thereby promoting a sense of sharing and connection.

03 Ideation

It Starts With An Idea

Once we defined the problem and understood Noble Nancy’s needs, we worked through potential solutions.

Brainstorming Up Ideas

Keeping Noble Nancy top-of-mind, my partners and I brainstormed ideas using the “I like, I wish, What if” method. We then used the dot method and voted on features we wanted to prioritize. These features were:

Find charities to donate completed work

Show how charity knitting impacts recipients

Creating a clean website with impactful graphics

Proposing Value

We worked through our value proposition by understanding our users’ motivations and needs. This really helped us understand why knitters would visit our site.

We felt that by developing Knitters United we could help knitters connect with a community of like-minded individuals looking to use their extra knitting materials for a good cause.

By allowing our users to crowdsource donations for a good cause, we offered them an opportunity to share project ideas, initiate charity drives, find organizations that benefit from their efforts, and see the impact their efforts have on the community.

Once we understood our value proposition, I created the value proposition canvas to ensure our site was positioned around customers like Nobel Nancy’s values and needs.

Value Map

Customer Profile

And The Business Case Is...

I next worked on the business model canvas to outline how the site would make money and to better understand our key partners and the role they played with Knitters United. This helped firm up the site architecture and the user journey for the website.

To determine a successful launch of Knitters United, we felt we needed to monitor obvious KPIs like the number of users and completed projects. 

Overall, our key KPIs would be:

• Users for the platform
  
• Number of new Charity drives per month
  
• Committed Pledges - annually
  
• Completed Projects - annually
  
• Social shares - per project 

The Journey

To help us understand how our users would interact with our app, we identified key actions our customers would take from introduction to the site to joining a knitting charity project.

From our user persona’s perspective, we felt that Nancy, who is an avid knitter, believes in doing her best to protect the environment and to help others in need. She loves homemade gifts and puts a lot of thought into what she makes for her friends and family.

She is looking for a platform that:

• shows her creative ways to use up her extra yarn;
  
• allows her to connect with others who have similar goals; and
  
• provides her with a purpose for her projects that would have a greater impact on the world.

The Experience

Opportunities  

During Awareness Stage

• Advertise on yarn store websites.
  
• Online advertising.
  
• Ask charities to be featured on their fundraising pages.
  
• Reach out to community influencers for some features.

During Site Introduction

• Write success stories on the website and feature them on different social media pages.
  
• Highlight meeting new people and other features of the site on different blog posts and on the home page.

When Joining The Site

• Highlight users’ efforts on the webpage in a blog post.
  
• Share campaigns on social media.
  
• Create a hashtag for users to use on their social media pages.
  
• Share with influencers.
  
• Advertise the content on social media to reach more users.

At Success Stage

• Share stories on social media using customer hashtags.

Follow The Flow:

We created a happy path for our users. The user flow goes from the home page to joining a charity initiative.

Happy Path - Knitter Donation

04 Prototyping

Let’s Get Wiry

We began by sketching out ideas for the site and brainstorming layout options.

Home Page

Project Page

Project Focus

Joining A Project

Thank You Page

Once we settled on an idea, we created the desktop and mobile low fidelity prototypes. I focused on the content while my partners worked on the prototypes.

Desktop Low-Fidelity Prototype

Home Page

Project Page

Project Focus

Joining A Project

Thank You Page

Mobile Low-Fidelity Prototype 

Home Page

Project Page

Project Focus

Joining a Project

Thank You Page

Building Style

Before moving to the high-fidelity prototype, we created a brand style guide for the website. All typeface and colours were tested for WCAG 2.0 standards to ensure the site was AA compliant.

PHOTOS

Photos used on our site are community-oriented photos of real people knitting or sharing. We try to use lots of colour and happy people interacting. The project images are user-submitted. Samples Include the following:

05 Testing

It’s Time To Test

Once we created the low-fidelity prototype, we tested the site with four participants.

I created a usability plan and each of us conducted the tests over zoom. Our results showed users felt:

• The layout was good and the site had a good flow. The click-through timing was quick and straightforward.
  
• Users liked the About us section as it provided insight into the purpose of the site.

BUT

• Users also felt confused based on some wording choices, especially with the CTA buttons as the tone changed from page to page.
  
• The placement of the CTA buttons was also confusing as it wasn’t consistent throughout.
  

High-Fidelity Testing

Adding the necessary changes to the prototype, we created high-fidelity prototypes for both the mobile and desktop versions of the site and then conducted several tests.

We did a 5-second test to determine if our design effectively communicated its primary message. Users felt the website’s purpose was clear and welcoming and the colour scheme seemed fun, however:
there were some issues with spacing, and some wording needed to be adjusted.

We also conducted an A/B test to determine what users thought about the card layout. Results showed 80% of users preferred option B as they felt it was easier to understand and had a cleaner design.

06 Final Product

It Was Time To Code

As non-coders, this was an interesting experience for us.  Working with the 12-column grid from Figma, we switched to Bootstrap 4 and created a framework with cards and fluid containers. There was a lot of back and forth between the other coder and myself as we tried to figure out ways to customize our site using Bootstrap elements. In the end, we were able to create a final product similar to our high-fidelity wireframes.

Below is the final product, viewed through the lens of our persona, Nobel Nancy.

Main Page

Our user, Nancy, is looking for project inspiration to use up her spare knitting spare material. She discovered the site through a friend in her knitting community and is excited to explore. She reviews the home page and appreciates seeing the charities associated with the initiative.

Project Page

Nancy decides to review the different projects available to join. She likes how they are listed in a clean and simple manner with large photos and clear directions on how to join.

Joining A Project

Nancy is intrigued by the sock project. She can explore the project requirements and has the ability to download the knitting pattern. She can connect with the project owner, see the status of the project with the number of socks received and pledged, and how long she has to knit her contribution. After reviewing the information, Nancy decides to pledge 3 socks to the initiative.

Thank You Page

After confirming her pledge. Nancy lands on the thank you page. Here she can choose to share her project goals on her socials and/or explore additional projects.

07 Conclusion

Some Thoughts About The Future

As mentioned previously, we felt we needed to monitor obvious KPIs like the number of users and completed projects.

We also felt it was important to monitor social shares. Our research indicated knitters are very active on social media and we believe having our projects and site shared online is a good indication of our success.

Overall, our key KPIs would be:

• Users for the platform
• Number of new Charity drives per month
• Committed Pledges - annually
• Completed Projects - annually
• Social shares - per project
  

The Future of Knitters United

We feel there is a lot of potential for knitters United. The next steps for the site could be:

• Gamification, adding badges to your profile for completed projects.
• Developing an app to help with tracking stitches and offering tutorials.
  
• Creating a way for knitters to share physical materials through our site.
  
• We could expand to other areas of crafting.
  
• And as always, iterate on our design, addressing more hot jar heat maps, analytics, and further user testing.

Time To Reflect

As a UX designer, I try and put myself in the shoes of my user. What are they concerned about? What are the emotional anxieties and thoughts that are present when someone is performing a task?

I think we could iterate on the site by thinking about the user’s experience when logged on versus visiting as a guest. With more time, we could also explore additional features to make a better user experience.

For example:

• The main feature I would like to explore is the difference between a registered user and a guest user.
  
• Would there be a way to have projects visited on the home page, similar to how shopping sites list recently viewed products?
  
• We could also engage with sponsors to have them create charity initiatives.

There is a lot of potential for a site like Knitters United. I believe with more time and further research, we could make the user experience even more robust.

Click here for a full listing all images

This site is copyrighted by Vandana Lahar © 2021. Some images contained on this site may be copyright property of others. Acknowledgment of these copyrights is hereby given. All such materials are used with the permission of the owner.