Website Design

Website Design

1. User Persona

   • Needs
     • A website that gives clear, readable text and images, rules, playing tips, how to count points, cost of everything, good rackets to buy
   • Fustrations
     • Unclear instructions, a boring appearance
   • Goals
     • I want to visit a website that teaches me how to play tennis
   • About them
     • A comebuytea part-time worker and likes tennis, badminton and music

2. Task Requirements

   • Self-Determined Criteria
     • Website that tells her how to play tennis
       • Good Tennis rackets
       • What the rules are
   • Prescribed Criteria
     • Your website must have an aesthetic that suits/aligns with your User Persona
       • Same theme connecting the pages together
       • Colours fit the theme of tennis
     • You must use HTML to organise appropriate information on your webpages using FIVE of the following:
       • Text ordered in paragraphs
       • Image of scoring system
       • Hyperlinks to Wilson and Yonex
       • Button linking back to homepage
       • A table of the cost of all equipment
     • Your website must include TWO aspects styled using CSS
       • There be different types of background for each webpage
       • Different font types e.g. bold text

3. Existing Solutions

   • yonex.com
     • Cons
       • tabs
       • images too big
     • Pros
       • layout
       • animation
   • wilson.com
     • Pros
       • layout
       • colours
     • Cons
       • Navigation
       • ads

4. User Interface

   • Features
     • Other Features
     • Example (e.g. Dark Mode)
   • User Interface Components
     • Buttons
       • Homepage buttons and buttons linking to other pages
     • Images
       • tennis court, line names and scoring system
     • Links
       • links to webpages and shopping platforms
   • Aesthetic
     • Colours
       • Blue
       • Orange

5. Coding Environment

   • Developer Tools
     • Notepad++
       • Coding app
     • Coding Language
       • HTML and CSS
   • Key Algorithms
     • Website Navigation
       • using buttons linking to the homepage and internal links
     • Other Important Algorithms