website design

website design

1. task requirements

   • prescribed criteria
     • • Your website must include TWO aspects styled using CSS o E.g. Background colour / Background image / font type / font colour
       • There will be a background image of a football pattern to suit the mood and engage the user persona of my website.
       • I will change my font type form times new roman to a more appropriate style to match the mood on my website to also engage my user persona for my website.
     • • You must use HTML to organise appropriate information on your webpages using FIVE of the following: o Image o Table showing information o Hyperlink to an external website o Ordered list or Unordered list o Button o Different heading sizes o Paragraphs o Video or moving image
       • I can use images to show what the skill looks like for better understanding for my user persona.
       • I will use a hyper link to an external website that can show them a video of how to perform the skill to make my user persona better understand the game.
       • I can create a ordered list to show every step on how to perform the skill to help my user persona preform it in game.
       • I will create buttons to make my website easier and more organized for different skills and rules and a home page.
       • I will use paragraphs and div tags for easier organization to create the things that u wants to learn in one div for an easier understanding and, the paragraph is in its own area.
     • • Your website must have an aesthetic that suits/aligns with your User Persona
       • I will create a website that can meet my user personas interests and goals to make him a website that he can use for any football need.
   • self determined
     • I will have multiple web pages for different skills ,rules and a home page
       • Pages for each individual skill to give better depth while also be engaging to my user persona
       • I will have a page for just the rules so they can learn the basics of the rules to play a fair game

2. coding environment

   • developer tools
     • notepad++
     • HTML file editor
     • visual studio
     • html,css
     • javascript
   • Key algorithmns
     • websitenavigation
     • other important algorithmns

3. user interface

   • features
     • a font that suits the website theme
       • images
       • buttons that send you to different websites
     • colours
   • user interface components
     • buttons
       • home page
       • difrent skills
       • rules
     • images
       • for the steps to preform the skill
       • basic rules of football
     • links
       • for videos to show how to preform the skill
   • aestetic
     • colours etc
     • images
     • background
     • div tags color

4. exsisting solutions

   • soccer.com
     • pros
       • shows images of the rules in reals matches
       • shows different formations
       • deep deatail on rules and how they work
       • best equipment for new players
     • cons
       • very little images not that engaging
       • information has a heading and not a div tag to separate information
   • play football.com
     • pros
       • vivd imagery
       • shows rules
     • cons
       • does not explain fundimental skills
       • does not show actual gameplay

5. user persona

   • needs
     • He expects a web site that can teach him the rules and skills while also wanting it to be attracting and exciting at the same time.
   • fustrations
     • His current frustration with websites he finds is they just tell him the move and have no pictures and steps on how to use that move or preform it as well he wants to learn the best moves and likes to see them in a table, but he has not found that so far. He also has frustrations with having no buttons for organization and easier access
   • goals
     • He is trying to get better at football and needs to learn the basics and some new skills.
   • about them
     • 14
     • year 8
     • wants to be a better footballer