Santa Monica Pier

Contexte

Le but de ce projet était de développer puis d’héberger un site web qui présente un lieu de notre choix. Il était ainsi nécessaire de travailler sur la partie front-end (wireframe, maquette, HTML, CSS) mais également sur la partie back-end (formulaire, PHP). Ce projet a été réalisé seul et en 2 semaines.


Veille graphique

Pour la création du site web, j’ai choisi de présenter un lieu phare de Los Angeles aux États-Unis : Santa Monica Pier. En effet, j’ai une certaine attirance pour ce pays mais cet endroit est également célèbre dans la pop-culture ce qui me plaît particulièrement.

En regardant sur Internet, nous pouvons remarquer que le site web officiel du Santa Monica Pier possède des couleurs vraiment lumineuses (blanc, rouge, bleu, …). Afin de contraster un maximum, j’ai décidé de partir sur des couleurs sombres et des dégradés qui font directement référence à l’ambiance de nuit que projette le lieu. Par conséquent, j’ai sélectionné du bleu très foncé (presque noir), du blanc mais aussi quelques nuances de bleu-violet-rose pour les dégradés dans le but de renvoyer un côté « néon ».

Couleurs choisies (avec leur code hexadécimal).


Concernant la typographie, j’ai voulu une nouvelle fois me différencier par rapport au site web officiel. C’est pourquoi j’ai utilisé deux polices d’écriture Sans-Sérif pour apporter de la simplicité et de la modernité.

Polices d'écriture choisies (Akira Expanded et Renogare).


Wireframe et maquette sur Figma


Structure des fichiers

Structure des fichiers du site web.


Développement du site web

Page d'accueil du site web.


Responsive

● Version ordinateur :

Extrait du site web sur ordinateur.


● Version mobile :

Extrait du site web sur mobile.


Technologies et logiciels utilisés

Développement web

● Figma
● Visual Studio Code
● HTML / CSS
● PHP
● 000webhost