Pines & Vines
An online publication for the perfect Sunday.
Project Overview
This project was to build a blog called Pines & Vines that pairs Pacific Northwest hikes with nearby wineries. The vision for the blog is to be a fun publication that hikers and wine enthusiasts can visit to get detailed information about trails and wineries. The goal of Pines & Vines is to ensure success and safety while hiking, and to promote small vineyards in Oregon and Washington.
My Role
User research
Product strategy
Graphic Design
UX Design
Prototyping
User Testing
Client Ask
The client wanted a fully responsive online publication that pairs hiking trails with nearby wineries. The layout should be simple and easy to navigate while still being attractive and on brand.
Problems to solve:
Getting all the information you need to go out hiking is hard. We are all busy, and we don’t want to put a lot of effort and research into our recreational activities. People are more likely to do an activity that’s pre-planned. Too many people find it easier to remain inactive during their free time.
There are many small wineries in the Pacific Northwest that struggle for business. Smaller operations have a hard time getting their name out there, and are often located too far outside the city for drop-in business.
Project constraints:
It must be easy to start and maintain. There should not be too much content, but enough to create a strong brand identity on the homepage. It must be mobile friendly with seamless transitions from desktop, to tablet, to mobile.
Strategy and Goal
Strategy:
This publication will be a fun website that people want to visit. The interface will be attractive and have an outdoors, Pacific Northwest theme. The content and tone will be lighthearted, relatable, and funny. The layout will be simple, with user friendly features. The most important information will be most visible, giving users the information hierarchy they need to be successful. Beautiful, high resolution images will be used often in order to appeal to users and show the social media potential of the activities.
Goals:
The goal of this publication is to create a comfortable, fun website that shows users the value of outdoor activity, as well as supporting their local wineries.
Research
I started this project by researching my potential users and websites that have a similar purpose. I used Oregon Hikers, Washington Trails Association, Washington Wine Blog, Northwest Cellars, Bearfoot Theory, Great Northwest Wine, and Wine Press Northwest for the competitive analysis. Looking at what the competition was offering gave me insight into what would make this publication stand out. I also conducted interviews with people at wineries, as well as hiking groups, to understand what would delight our users.
The Findings
After collecting data on competitive products and potential users, I transformed the findings into features we could offer. One common shared trait of the people I interviewed was that people are motivated by things they find enjoyable, and things that make their life easier. Another finding was that people wanted a lot of information, but didn’t want to do a lot of reading. Also, they wanted what they were reading to be fun and uplifting. A common sentiment was about ease of use. Most people mentioned wanting very simple interfaces with few pages. According to the research users were more loyal to publications that gave them frequent notifications on their posts.
Hypothesis:
By creating a publication that’s fun to read, and the content helps its users do the things they love, users will be more likely to get outside more and support local wineries.
Personas
I created personas in order to better understand the site’s potential users. I wanted to know the problems and motivations of the people that will read this publication in order to better serve their needs. By narrowing down their motivations and desires I could create a design and content that would interest them.
Sketches and Wireframes
I started the designing process by making some rough sketches. This allowed me to experiment with some ideas and pivot quickly. I love to draw, and sketching out my designs is one of my favorite parts of the process. After I had some sketches I liked I made wireframes. Each page had three wireframes, one for desktop, one for tablet, and one for mobile. Once the wireframes were complete I could get feedback on the layout without the distraction of other design elements.
Mockups
After the layout had been confirmed, I created high fidelity mockups. During this stage I added photos, colors, fonts, and branding to get a look at what the finished product will look like. The photos are a very important part of the design for this site, so I wanted to give as much screen space as possible to beautiful pictures of the Pacific Northwest while keeping the layout clean and simple. The UI design is meant to make the user feel like they are going on an adventure just by visiting the page. It was also important to me that the atmosphere of the site stay consistent on smaller devices.
Prototype
Once I competed the mock ups I create click through prototypes to show stakeholders and test users. The prototypes helped give the full experience of interacting with the site. When designing responsive websites, I make sure to test the layout on as many devices as possible. It’s important that the design holds up on any screen size. From there I could start making changes based on the feedback I received.
Final Product
Once I made the final design changes based on user testing, I could now finalize the design and send it off!