Overview
Purpose
The purpose of the Dry Oar website is to increase our visibility on the web with two main goals. The first goal is to provide a platform where customers can find information about our tours and other services we offer as a business. This includes a blog with posts and pictures about past tours, general information about white water rafting in our area, and posts from our tour guides and other staff to get potential customers excited about a white water rafting tour. The second goal is to provide an easy way for customers to view pricing and availability for the various types of tours we offer and the ability to reserve a date and pay for tours and white water rafting trips completely online.
Audience
Our target audience is primarily people looking to book white water rafting trips. However, as we offer a wide variety of types of tours, including varying trip lengths and difficulty levels, we have a varied audience that will be using this site.
- Businesses: Our largest audience is businesses that are looking to plan short day trips for a group of employees. These trips are typically planned by executive assistants or event planners who will primarily be accessing our website from a desktop browser. These customers typically have little experience with white water rafting but have fairly large budgets. These customers are looking for a single place to find all the necessary information to plan their company trip.
- Youth Groups: Another fairly large audience is youth groups from churches, schools, or local youth organizations. These trips are also planned by a singular individual, usually the group adult leader. They are similar to business groups with the use of desktop browsers and needing a one-stop-shop for all information regarding their trip. However, these customers typically have a smaller budget.
- Individuals/Small Groups: Our smallest audience includes adventure-seeking couples, small family groups, or larger family groups, such as reunions. These customers often use a variety of devices to plan their trip, but especially mobile devices. Currently, we've found this group has trouble finding availability and pricing with existing similar company websites. This group typically has a smaller budget, but will often plan multi-day trips
Branding
Website Logo
Style Guide
Color Palette
Palette URL: https://coolors.co/008690-dd6031-e0ca3c-E2FBFF-333333
| Primary | Secondary | Accent 1 | Dark Fonts/Dark BG | Light Fonts/Light BG |
|---|---|---|---|---|
| [#008690] | [#E0CA3C] | [#DD6031] | [#333] | [#E2FBFF] |
Typography
Heading Font: Changa One
I chose this font because it's modern, bold, and fun. These are all qualities I wanted to highlight and reflect as qualities of the company. It's also very recognizable but still readable.
Paragraph Font: Poppins
Paragraph text, in my opinion, should be simple and readable and not detract from the content on the page. Poppins fit that requirement while also being another modern, easily readable font.
Normal paragraph example
The best Whitewater Rafting in Colorado, White Water Rafting Company offers rafting on the Colorado and Roaring Fork Rivers in Glenwood Springs. Since 1974, we have been family owned and operated, rafting the Shoshone section of Glenwood Canyon and beyond.
Colored paragraph example
Trips vary from mild and great for families, to trips exclusively for physically fit and experienced rafters. No matter what type of river adventures you are seeking, White Water Rafting Company can make it happen for you.
Navigation
Site Map
The Site Map of a site is just like it sounds…it is a map of the pages in a site and how they are related and linked together. From the map above we can see that we will eventually have the Home page and 2 sub or child pages.
The lines that connect them all together indicate that each page should be accessible from any other page, it is essentially showing us the global navigation for the site.
Wireframes
Home Page
Wireframes are like blueprints for making webpages. They should show the major sections of content that will be on the page and the relative locations of each element. In the wireframe below you can see there will be 6 sections to our page:
- At the top we have a section with the logo (the box with the mountain means an image) and the navigation bar.
- Then there is a banner image that stretches all the way across the screen.
- Next we have some text and an image
- ...followed by another row made up of an image and some text.
- Then one more section of text with no image.
- Lastly, a footer containing a copyright/name line and 3 social media icons.
Our Tours Wireframe
In the wireframe below you can see there will be 4 sections to our page:
- At the top we have a section with the logo (circle image) and the navigation bar.
- Then there is a banner image that stretches all the way across the screen with text in the middle to highlight the Dry Oar tours page title.
- Next we have a two column grid with a section for each of the tours. Each tour section includes the tour name, an image, a brief description, and a Book Now button.
- Lastly, a footer containing a copyright/name line and 3 social media icons.
Blog Wireframe
In the wireframe below you can see there will be 6 sections to our page:
- At the top we have a section with the logo (circle image) and the navigation bar.
- Then there is heading text denoting this is the blog page.
- Next we have the featured post section, which includes an image on the left, with the header and text on the right
- Next, we have the main blog posts section, which shows a scrolling list of blog posts, with headers centered above an image on the left and text wrapped on the right.
- After a few blog posts, there's a "load more" link to load more blog posts
- Lastly, a footer containing a copyright/name line and 3 social media icons.
