Cupcake Factory

Cupcake Factory est mon tout premier site web. Designer et intégrer seul un site vitrine entièrement responsive d’un magasin de cupcake, voilà ce qui était demandé. Un projet qui m’inspire assez bien dès le début.

D'abord, quelques recherches

Première étape : réaliser un design process, afin d’avoir une ligne de conduite et de définir toutes les choses à faire. Ensuite place au rétro-planning pour terminer le travail à faire à temps et ne rien oublier. Et pour finir, analyser la concurrence.

note du design process note du retroplanning

Au boulot ...

Le header est ma prochaine étape. Je trouve rapidement l’image parfaite. Une photo de cupcake dans les teintes brunes, qui fonctionne bien avec le bleu et l’orange. Il ne me reste plus qu’à mettre le texte en place: le nom et le slogan de ce magasin.

Le contenu textuel nous est fourni. Il faut juste trouver une mise en page, les visuels, et surtout, trouver comment organiser les infos de la meilleure façon possible. Je décide de faire un one-page avec un menu fixe afin de pouvoir facilement voyager dans le site.

La gamme de produits est assez vaste, donc pour ne pas trop scroller, je décide de mettre au début de cette section une vignette par sorte de produit ( cupcake - cheesecake - café - thé - soft ). Chaque vignette est un lien qui ramène à sa gamme de produits. Toutes les photos de la gamme de produits sont de moi. Elles ont toutes été réalisées dans ma cuisine puisque je n'avais pas accès à un studio photo.

Vous désirez ... ?

Il faut également un bouton pour pouvoir commander un produit en ligne. Je décide donc de mettre un call of action dans le menu fixe ainsi que dans la partie contact. De cette manière, le client peut, à tout moment, commander un produit sans devoir voyager dans la page.

Tout le site est sur fond blanc. Je décide donc de mettre le footer, avec la partie contact et les liens vers les réseaux sociaux, sur un fond noir pour le faire ressortir. Se trouve également dans le footer, les conditions de réservation.

Et responsive en plus

Une fois mon site terminé, il faut le rendre responsive : c’est-à-dire qu’il doit être lisible sur tous les écrans. Cette étape me prend autant de temps que créer le site. En effet, pour chaque élément, il faut vérifier qu’il soit lisible sur tous formats d’écrans. Et que l’ensemble du site ait une belle mise en page, que ce soit sur tablette ou sur smartphone.

Et cela me prend énormément de temps, surtout que pour certaines parties, j’avais triché pour les mettre en page au format “ordinateur”. Du coup, pour ces dernières, la mise en forme sur les autres formats d’écrans devient dès lors plus laborieuse...

Toutefois, pour mon tout premier site web, et responsive de surcroît, je m’en sors assez bien. Evidemment, il y a des choses qui ne vont pas et qu’il faut changer, mais je suis assez satisfait de moi.

Consulter mon site
Découvrez le projet Cupcake Factory