Website Design

Website Design

1. Task Requirements

   • Prescribed Criteria
     • You must use HTML to organise appropriate information on your webpages using FIVE of the following
       • Button will lead to the next page with other images.
       • Image of the car making the audience more interacted.
       • Hyperlink to an external website, this will lead to another website with much more information.
       • Ordered list or Unordered list, will put the spec of the car in order.
       • Different heading sizes, the main heading of the webpage is ‘BMW M3’. In a different size to make it interactive.
     • Your website must include TWO aspects styled using CSS
       • The website will include Background Colour and Fonts to make the website more appealing and easier to read.
       • The fonts will be used as the main heading of the webpage and the image will show and describe the car.
     • Your website must have an aesthetic that suits/aligns with your User Persona
       • The fonts make the webpage more fun to read.
       • The background colour makes it interesting.
   • Self-Determined Critera
     • The website will clearly show that why the BMW is good and benefits and value of the wonderful car.
       • Provides a link to the main website with all the information.
       • Dot points will be indicating additional information about the specs of the BMW.

2. User Persona

   • Needs
     • They need a website with images and information about a BMW car so he can think about reselling it.
   • Frustrations
     • They don’t have much images and don’t provide colours/fonts to make the website more interesting.
   • Goals
     • To be a successful car reseller and make profit.
   • About them
     • Azaan wants to see the value of each part of the BMW, without less images he gets confused what is what. He needs images and clear description of each part and their cost so he can sell the whole car by its actual cost trying to make a profit.

3. Existing Soloutins

   • https://www.bmw.com.au/en/models/m-series/bmw-3-series-m-models/bmw-m3-sedan.html
     • Cons
       • Too many words and font are hard to read
       • Too dark and hard to see
     • Pros
       • Gives a lot of information
       • The image of the car is displayed well.
   • https://www.brisbanebmw.com.au/Home
     • Pros
       • Has great images and style of them displayed.
       • Has buttons which lead to different pages making easier to navigate.
     • Cons
       • Not much information
       • Doesn't give precise price of the car.

4. User Interface

   • Features
     • Other Features
     • Example (e.g. Dark Mode)
   • User Interface Components
     • Buttons
       • Navigation to pg 2
     • Images
       • Image of car
     • Links
       • Navigates to official website
   • Aesthetic
     • Colours
       • Yellow
       • red

5. Coding Enviroment

   • Key Algorithms
     • Other Important Algorithms
     • Website Navigation
   • Developer Tools
     • Notepad++
       • Software used for coding
     • Coding Language
       • HTML and CSS