Welcome to The Hague
Welcome to The Hague
Welcome to The Hague
Welcome to The Hague
— Get a tour of famous buildings in the city —
— Get a tour of famous buildings in the city —
— Get a tour of famous buildings in the city —
— Get a tour of famous buildings in the city —
Year
Year
Year
Website
Website
Website
Grade
Grade
Grade
2018
Year: 2018
Year: 2018
8/10
Grade: 8/10
Grade: 8/10
Objective
Objective
Objective
Objective
Welcome to The Hague is a school assignment for Visual Skills class at The Hague University of Applied Sciences. The assignment was to design a three-page website that would showcase in any way something related to The Hague.
I decided to design a website for tourists who would like to visit the most famous places in The Hague and get a tour guide.
My inspiration for this project is the official website of the city which helped me with choosing what buildings to include in my design.
Simulation of browsing the homepage.
Simulation of browsing the homepage.
Simulation of browsing the homepage.
Process
Process
Process
Process
Process
I started with curating general information about The Hague. Especially helpful resources were, in this case, the official website of the city (denhaag.com) and Wikipedia.
One of the first things I wanted to know is how does a flag of the city look like so that I can make a colour palette.
Because the flag of The Hague looks like this it would be really difficult to create a visually attractive interface.
Below is an image of the first version of the website (on the left) and final version (on the right side).
Before / After
Before / After
Before / After
Before / After
Minimalism — showcase
Minimalism — showcase
Minimalism — showcase
Minimalism — showcase
Minimalism — showcase
↑ Newsletter form & Menu items / Discover tabs on the homepage (detail) ↑
↑ Newsletter form & Menu items /
Discover tabs on the homepage (detail) ↑
↑ Newsletter form & Menu items / Discover tabs on the homepage (detail) ↑
↑ [Left] Opening Hours of a building and detail of calendar with events ↑
↑ [Above] Opening Hours of a building and detail of calendar with events ↑
↑ [Above] Opening Hours of a building and detail of calendar with events ↑
↑ [Left] Pop up window will display after clicking the pin icon on the map ↑
↑ [Above] Pop up window will display after clicking the pin icon on the map ↑
↑ [Above] Pop up window will display after clicking the pin icon on the map ↑
Style guide
Style guide
Contents:
-- Fonts [1 fontface]
-- Colors [~4]
↓ SCROLL DOWN ↓
Fonts
Fonts
H1
Header
Header
Maison Neue - Bold
H2, H3, H4
Subheader
Maison Neue - Bold
H5, P
Paragraphs and body text
Maison Neue - Book
H6
DESCRIPTIVE TEXT AND TYPE FIELD TEXT
Maison Neue - Mono
Color palette
Color palette
C1 - Black
#0A1019
RGB(10,16,25)
C2 - Faded blue
#4B5566
RGB(75,85,102)
C3 - Grey
#757575
RGB(117,117,117)
C4 - White
