Skip to content

mocha-maker/paradigmpet-prototype

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

paradigmpet-prototype

Scenario

Paradigm Pet Professionals needs to redesign its website with the goal of having 100,000 new visitors and 150 new consults within the next year. They provided a design brief, user personas, old website files, website copy, and their new logo.

Process

Needs & Solutions Analysis

My first step was to review the current website and do a user and stakeholder needs analysis.

I figured out how I would solve their needs using the three (3) design areas of content, functionality, and navigation.

Design Areas Unmet User Needs User Needs Solutions Unmet Stakeholder Needs Stakeholder Needs Solutions
Content Users need recommendations about pet toys that encourage physical activity, and the “Dogs” page doesn’t have any information on dog toys. I will include information on the “Dogs” page about dog toys. Stakeholders need users to trust the company for information to encourage users to contact them for consultations but there is no legitimizing information or credentials about the company on any pages. I will include the company’s experience and credentials on their “About” page.
Functionality Users need to easily navigate on various mobile devices and desktops, but the website does not have a responsive design to accommodate multiple viewport sizes. I will redevelop the website with responsive layouts. Stakeholders need to gather information from their users to be able to properly reply to their consultation requests, but there is no contact or survey form for users to fill out and submit. I will create a consultation request form on a dedicated “Contact Us” page.
Navigation Users need a predictable way of finding their way around the site, but the navigation bar does not have consistent formatting, structure, or hyperlinks. (E.g., the FAQs page does not have a functional home link and the Dogs and Cats link positions are switched.) I will design a navigation bar that is consistent, with no dead links, and provides feedback on which page the user is currently on. Stakeholders need to have a high SEO ranking to bring in more organic web traffic and meet their site goal of 100,000 new visitors within one year, but their title and meta-tags information are not using keywords that search engines use. I will ensure the title and meta tags include their desired keywords “new pet consultation” and “new pet care consultation”.

I ended up with the following list:

  • Make the website responsive
  • Build trust by adding the company’s credentials and experience on the “About” page
  • Build a “Contact Us” page with a form whose contents are sent to the company
  • Develop an SEO plan including the keywords “new pet consultation” and “new pet care consultation” etc.
  • Redesign the navigation to provide page indicators and ensure no deadlinks.

Site mapping

One of the main pain points was to improve the site’s navigation.

  1. To start this process I designed the site map that I would be using to base my wireframe on.
  2. I ensured there was an “About Page” and a “Contact Us” page because that was identified as a core need.
  3. I then created a hierarchy to group company information, pet care information, outgoing links to adoption sites, and a Call to Action (CTA) which will be a part of the core navigation bar.

Wireframing

Using the site map as a guide, I began designing the wireframes starting from the top (Home) and going down to the subpages. I used Figma to create the following high-definition wireframes.

Prototype

Finally, I used the high-definition wireframes to produce a prototype using InVision in order to demonstrate the site's functionality.

About

A prototype for the redesign of a pet consulting company's website.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published