Wooli

an outlet for fiber aritsts














Tools

Figma
FigJam
Teams

Roles

UX Designer
UX Researcher


Timeline

Jan - Apr 2024



Team

Dylan Bagwell
Sydney Bishop
Megan Hagert
Matthew McNair
Eden Stoessel

Skills

UI Design
Prototyping
UX Research
User Interviews



INTRODUCTION

A creative outlet for fiber artists 


Wooli is a web application prototype created to facilitate collaboration, education, and inspiration among fiber artists in one location. This project was designed alongside a team of fellow students in my senior capstone class at Kennesaw State University.  To develop Wooli, our team followed UX frameworks we learned throughout our time at university and adapted it to fit our project timeline. 

View Wooli’s FigJam Workspace and Prototype below:






PROBLEM

Fiber artistry lacks a modern platform


Without a central hub, the fiber arts community is fragmented across various social media platforms, forums, and websites. This makes it difficult for artists to connect, collaborate, and share resources effectively. For emerging fiber artists, it can be challenging to gain visibility and reach their target audience without a dedicated platform. They may struggle to stand out among the vast array of content on existing platforms. Accessing resources such as tutorials, patterns, and educational content may require scouring multiple sources, leading to inefficiency and frustration. A central platform could streamline access to these resources, making learning more accessible.




SOLUTION

Create a community hub


Wooli aims to fill this crucial missing platform by providing by facilitating collaboration, education, and inspiration among fiber artists in one location.




APPROACH

Goal Directed Design


In order to make sure that our design was always centered around the needs, goals, and motivations of the user throughout the project, our team adhered to the Goal-Directed Design (GDD) methodology.

To make sure that our platform efficiently satisfies user needs, we began with extensive research. We improved our understanding of users' aims and actions by creating fictitious user models based on our study, which helped direct our development process. We iterated on the design and incorporated feedback to develop and complete the product through user testing and prototyping.




INITIAL PROBLEM DISCOVERY

Could patterns be generated easily on a digital platform?


Wooli was developed for a university project. Therefore, our team took on the role of stakeholders to simulate a professional Kickoff Meeting. After thorough analysis, we found that although many fiber artists use pattern design apps, they need to use out dated platforms and do not necessarily see a significant impact on their designs and creative expression.

Product Problem Statement:


The current state of the fiber arts apps has focused primarily on the distribution of existing patterns. What existing products/services fail to address is the need for a unified community among fiber artists where they can design, create and share their designs. Our product/service will address this gap by providing an all-in-one hub for fiber artists to easily create new pattern designs, manage and organize their designs, and connect with other artists.




LITERATURE REVIEW

Cultural and economical research were crucial


To better understand the topics of fiber arts, social media, and e-commerce, we gathered a variety of reputable resources. Here were some of the main takeaways we had after reading the resources we gathered:

  1. The broader question of how we want to integrate E-commerce into our app necessitates an assessment of the pros and cons. It might be more effective to just focus on pattern selling, and not physical products. This model eliminates the complexities of shipping and provides users with instant access to their purchased patterns.
  2. We might have our branding revolve around the story of Arachne. The story underscores the cultural, religious, and social importance of weaving in ancient Greek society. It showcases weaving as a skill with both practical and symbolic significance, reflecting the broader cultural values of artistic excellence and respect for the divine.
  3. Reddit gives insight into what information fiber artists look for when looking for inspiration, along with what we should avoid that would cause our users to think negatively about our product.
  4. The core feature of our project is the design canvas—a scalable pixel grid functioning as an artboard. This aligns with the essence of Graphghans, where crafters use a visual graph or chart to create patterns. The digital design canvas will essentially serve as a virtual representation of the graph, allowing our users to intuitively design and visualize their own patterns.




COMPETITIVE AUDIT

Other fiber artistry apps are scarce and lack modern design


In order to increase the chances of success for our app, we looked at the pros and cons of four different potential competitors: Stitchboard, Stitch Fiddle, Winstitch, and Ravelry. This gave us insight into what would be effective for our app, along with areas for improvement.





USER RESEARCH INTERVIEWS

User Research Interviews


We conducted five preliminary wireframe tests and two high-fidelity usability tests. For these tests, we observed users interacting with our website. While they navigated the website, we encouraged them to make comments.


Ultimately, there were many observations from both participants. A few notable changes we made after testing were:

  1. Making important buttons stand out more
  2. Allowing users to upload pattern instructions as a PDF, as opposed to writing them in our website
  3. Changing our learn page to make it more visually engaging (before and after screens below)






AFFINITY MAPPING

What are the similarities?


After conducting each user interview, we identified our key observations among them and created an affinity map. These maps helped us group the behaviors and feelings of our participants while also identifying common themes and patterns across all interviews. We came away with clusters of sticky notes for each interview that represented the main takeaways from each participant.





MODELING

Consolidating our findings 


We consolidated our research to clearly seek common patterns in our research to define user goals. As a result of this process, we came up with our Persona, Fredricka Crocherita.





FRAMEWORKS

Brainstorming potential solutions


Once we established the requirements for our personas, we moved on to the Frameworks phase of our project. Here, we developed low-fidelity wireframes and mapped the key pathways for our personas to achieve their goals. Once we determined the layout of our website, we transitioned our design to a high-fidelity prototype.

We created low-fidelity wireframes in FigJam to use as a reference for building our prototype. We used the wireframes to establish the information architecture and layout of the site while referencing our context scenario and requirements list to identify necessary screens and features. Within the wireframes, we considered how our personas would interact with the site and mapped out the likely paths they would take.




We identified our primary persona's key path scenario by referring to the context scenario. The green line represents the key path scenario- the primary persona's most common way of interacting with the website on a daily basis. The blue, purple and red lines represent validation scenarios, which are secondary tasks or less frequently used paths that the user may take within the site. In particular, the red line represents the secondary persona's goal of learning more about fiber arts.





REFINEMENT

A creative outlet for fiber artists


After creating our prototype, we conducted two user interviews. We utilized various usability testing methods such as A/B testing and assigning task-based scenarios to each participant. As team leader, I moderated both usability tests while my teammates carefully documented the feedback we received. We discussed our findings after each interview and made necessary modifications to our prototype. Iterating on our design in response to the feedback we received helped us make significant improvements to enhance the overall user experience.




Design Changes

  • Based on our feedback, we felt that the website needed a dedicated home page separate from the discover feed to give users a better sense of their location within the site. Upon login or sign up, users are now directed to a landing page. This landing page features a bright call-to-action button which prompts users to try out our AI pattern generator.
    • New users are prompted with a "sign up" modal as they attempt to scroll the content on the page.
    • Returning users are given snapshots of their most recently saved patterns, so they can jump right back into their projects.
  • For uploading patterns, users are now given the option to upload a PDF, rather than input text into a text field. This change helps speed up the process of uploading a pattern and makes the task less demanding of the user.




CONCLUSION

A creative outlet for fiber artists


Wooli became a project that solidified my skills I learned throughout my time at university as a designer. It was my senior capstone proejct and it was rewarding to see me and my fellow team of senior design students collaborate and put everything together. It was interesting and rewarding to explore a new and unconventional topic that effects a very real problem in the fiber artistry community and market.

A key takeaway from this experience on this project was to learn how to quickly switch between original concepts to stronger, more relevant concepts. We had originally thought to build a artboard and pattern design board, but after interviews and further brainstorming we decided to pivot to the usage of an AI generator.

I also further honed my Figma skills and was able to fully understand variables.



        Last updated: December 2023