Brief
Exploiting the principles of balance and colour and the assets provided, create designs for an iPad app or web app.
This should comprise of a landing page and a product page for each of the three bikes.
- One set of designs using symmetrical balance, another using asymmetrical balance.
- One set using a complimentary colour scheme, the other using a contrasting colour scheme.
- You can combine the above to create two sets of designs.
e.g. symmetry + complimentary colours / asymmetry + contrasting colours.
You must use at least three of the images across the two spreads (you can also find your own images too)
You can create more than one set of ‘final’ screens
We would like to see you use Figma to develop the digital design work for this project, as it's dominant in the space of digital design.
Alignment, hierarchy, contrast and negative space... you should employ these principles as well as balance and colour
You can use texture in the type, images, background, etc.
You can manipulate the type (e.g. tracking, leading, outlines, inlines, etc.)
This should comprise of a landing page and a product page for each of the three bikes.
- One set of designs using symmetrical balance, another using asymmetrical balance.
- One set using a complimentary colour scheme, the other using a contrasting colour scheme.
- You can combine the above to create two sets of designs.
e.g. symmetry + complimentary colours / asymmetry + contrasting colours.
You must use at least three of the images across the two spreads (you can also find your own images too)
You can create more than one set of ‘final’ screens
We would like to see you use Figma to develop the digital design work for this project, as it's dominant in the space of digital design.
Alignment, hierarchy, contrast and negative space... you should employ these principles as well as balance and colour
You can use texture in the type, images, background, etc.
You can manipulate the type (e.g. tracking, leading, outlines, inlines, etc.)
RESEARCH
Web apps
A web app is software that runs in a web browser, and can be accessed on any device with a browser.
Below are examples of landing & product pages.
Below are examples of landing & product pages.
Mobile apps
Colour theory
- Complementary colour combinations are the pair of colours positioned opposite to each other on the colour wheel. These contrasting colours catch the eye and leave quite an impact - examples: red and green, yellow and purple, orange and blue.
- Analogous colour combinations refer to any two to five colours adjacent to each other on the colour wheel. These combinations create a sense of balance and harmony. Typically, one of these colours will be more dominant and sit in the foreground, while the other colour will sit in the background - examples: yellow, yellow-green, and green; violet, red-violet, and red; red, red-orange, and orange; blue, blue-violet, and violet.
- Triadic colour combinations select three evenly spaced colours throughout the colour wheel. These combinations tend to be vibrant, creating a dynamic and harmonious visual contrast when combined. You can find your three triadic colours by creating a triangle on the colour wheel - examples: red, yellow, and blue; green, orange, and blue-violet; red-orange, yellow-green, and blue-violet.
- Tetradic colour combinations use four colours spaced evenly on the colour wheel to form a square or rectangle - examples: Red, yellow-green, light blue, purple; magenta, green-yellow, blue-green, and indigo.
- Analogous colour combinations refer to any two to five colours adjacent to each other on the colour wheel. These combinations create a sense of balance and harmony. Typically, one of these colours will be more dominant and sit in the foreground, while the other colour will sit in the background - examples: yellow, yellow-green, and green; violet, red-violet, and red; red, red-orange, and orange; blue, blue-violet, and violet.
- Triadic colour combinations select three evenly spaced colours throughout the colour wheel. These combinations tend to be vibrant, creating a dynamic and harmonious visual contrast when combined. You can find your three triadic colours by creating a triangle on the colour wheel - examples: red, yellow, and blue; green, orange, and blue-violet; red-orange, yellow-green, and blue-violet.
- Tetradic colour combinations use four colours spaced evenly on the colour wheel to form a square or rectangle - examples: Red, yellow-green, light blue, purple; magenta, green-yellow, blue-green, and indigo.
Complementary colour schemes
Analogous colour schemes
Tutorials
Tutorials I found useful for this project
|
|
|
|
|
|
Imagery
Brief imagery
Logo
Bike imagery
DEVELOPMENT
Learning and following tutorials
Landing pages
|
|
|
|
|
Product pages
Final designs
Asymmetrical design with analogous colours
Symmetrical design with contrasting colours