Select Page

Rose City Yarn Crawl

Website Redesign | Graphic Design | Wire Frames | Responsive Design

The Rose City Yarn Crawl has been a local Portland experience for almost a decade. It is a vibrant celebration by and for local knitting and crocheting enthusiasts. The RCYC’s brand is quirky, enthusiastc, and very much patterned around a tight-knit community for Portland’s fiber enthusiasts. As a result, their website design needed a quick loading UI for both its admin and users to help navigate the RCYC’s sites and events. This website design mixes a clean and open-feeling environment with squiggle lines of bright blues in order to capture the playful nature of the local knitting stores and bubbly busy owners involved in the events. The design of the site is neat and places importance more on the patterns being sold at each location, the events at each location and how to participate in the Rose City Yarn Crawl. In a collaborative effort with Sirius Media LLC, Avocational Design helped design wire frames, visual design proofs, and site maps that lead to a website that reflects the unwavering enthusiasm of the Rose City’s crafty knitting experience that is Rose City Yarn Crawl.
Check Out Rose City Yarn Crawl

Design Process

Take a look at some of the process.

Design Ideation

While brainstorming the informational architecture of the site, it was important to consider the flow of the user’s experience. Luckily, we had been able to meet with multiple members of the Rose City Yarn Crawl board and local knitters that had used the site in the past- we focused on the user’s journey from actual people that used the site. The image above is a glance at one of the iterations of the simple site-map layouts.

Wireframes

Some key project requirements were that site front-end users (people using the site for information and purchasing products) and site content-contributors (Rose City Yarn Crawl committee/board members) could use the site on multiple platforms and be able to quickly look up site content. The wireframes were created to demonstrate how the site map would flow for both kinds of users. The system was designed to flow from one venue and event to the next, so that each venue would be equally represented and events and patterns for purchase at each venue would be easy to find.

Visual Design

The Rose City Yarn Crawl provided us with their logo, a large library of professional knit and crochet pattern images, and inspirational website examples for us to gain design cues from. We worked with the committee to come up with the rest of the design elements. We considered how each color, transition, type, etc would contribute or detract from the UI of the site, the design preferences of the committee, and the site’s ease of use.

We went through multiple rounds of visual design development before arriving at the final design choice. The ultimate goal was to make sure that the site was responsive, easy to move through, and consistent in its design. We came up with a site that features event calendars to easily add and share events, interactive maps, slideshows showcasing knitting and crocheting images,  incorporated ecommerce, and an interactive patterns page.

Visual Design

The Rose City Yarn Crawl provided us with their logo, a large library of professional knit and crochet pattern images, and inspirational website examples for us to gain design cues from. We worked with the committee to come up with the rest of the design elements. We considered how each color, transition, type, etc would contribute or detract from the UI of the site, the design preferences of the committee, and the site’s ease of use.

We went through multiple rounds of visual design development before arriving at the final design choice. The ultimate goal was to make sure that the site was responsive, easy to move through, and consistent in its design. We came up with a site that features event calendars to easily add and share events, interactive maps, slideshows showcasing knitting and crocheting images,  incorporated ecommerce, and an interactive patterns page.

Contact

1 + 6 =