Le client

Tanzanie Adventure Safari est une société tanzanienne gérée par des tanzaniens.
L’entreprise propose des safaris de plusieurs jours, des excursions spéciales dans les différents parcs nationaux, des randonnées dans les montagnes de Tanzanie…

L’objectif

Réaliser un site web simple d’utilisation pour l’internaute en y incluant des visuels et des informations sur l’entreprise, les lieux, et les activités proposées. L’objectif principal étant de donner de la visibilité et de la notoriété à la société.

L’univers

Après discussion avec le client, nous avons déterminé un style devait être sobre et épuré afin de donner au visiteur l’information essentielle sans y ajouter de superflu.

Coloration

Pour la coloration, le orange du logo est l’unique couleur présente sur le site web. Le reste du site est noir et gris.

Interactions & animations

Dès la page d’accueil, le visiteur peut interagir avec son environnement en positionnant son curseur sur « Watch our video ». Le bouton s’anime et un preview de la vidéo se lance tout en remplaçant l’image sur la droite.

Au bout de quelques secondes passé sur le site sans scroller, le visiteur pourra apercevoir l’animation d’un véhicule (4×4 de safaris) entre le logo et le menu.

Organisé & simple

Un site web bien organisé où l’information est directement visible et accessible par le visiteur.

• 

Le développement

Pour le développement, j’ai choisit d’utiliser le CMS WordPress pour son back-office simple d’utilisation. J’ai développé un thème sur-mesure en suivant le design préalablement réalisé sur Adobe XD.

Les langages utilisés sont : HTML, CSS, SCSS, JavaScript, PHP. J’utilise également Gulp.js

Le CSS et le JavaScript sont minifiés dès l’enregistrement grâce à Gulp.js

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

• 

Objectif

Réalisation de l’application web Tripply, l’agence de voyages pour les étudiants. L’application est simple, un formulaire permet de récupérer les informations et les enregistre en base de données.

Création

J’ai tout d’abord réalisé les maquettes du site avec le logiciel Adobe XD, puis j’ai développé l’application web.

Design

Les maquettes du site ont été réalisées avec le logiciel Adobe XD. Le site est séparé en deux parties, la partie gauche correspond au formulaire, et la partie gauche correspond aux informations sur Tripply grâce à un carrousel.

Développement

Pour le développement, j’ai utilisé le HTML pour la structure, le SASS couplé à Gulp.js pour le style. Le JavaScript et le JQuery pour le dynamisme. Et le PHP pour la partie base de données.

• 

• 

• 

• 

• 

Le client

Simba, un guide Tanzanien souhaitait créer une identité pour sa nouvelle activité, le safaris, en créant un logo.

Contact

Nous avons échangé en anglais afin de déterminer les éléments et les couleurs à intégrer au logo. Simba, le client avait déjà une idée bien précise de ce qu’il souhaitait : un arbre, un guerrier Massai, et le Kilimandjaro. Pour les couleurs nous avons choisi ensemble une couleur « chaude »

Élaboration

J’ai tout d’abord réalisé un logo contenant les éléments souhaités (un arbre, un guerrier Massai, et le Kilimandjaro) par le client, je l’ai présenté au client. Il a tout de suite apprécié.

Coloration

En accord avec le client, j’ai coloré le logo avec des couleurs « chaudes » pour représenter l’Afrique.

• 

• 

• 

• 

Contexte

Rubis est une marque de vêtements et d’accessoires de sport.

La force et le positionnement de Rubis :

• Une marque parisienne qui promet produits de hautes qualités
• L’influence mondiale de la France sur mode et la haute couture
• Une implantation dans les plus beaux lieux (touristiques) de Paris
• Une exclusivité parisienne
• Un prix juste

Le site a déjà été réfléchi par l’équipe communication de Rubis et une charte graphique est déjà établie. En plus de cela s’ajoute la contrainte de devoir être connecté pour pouvoir ajouté un commentaire sur les articles. Je devais alors créer une page de connexion et d’inscription.

J’ai utilisé le thème Divi de WordPress pour créer ma “base”. Mais le thème ne me suffisait pas, il fallait par exemple que j’ajoute moi même le second menu (celui du haut) dans le code en passant par un thème enfant.
J’ai alors utilisé le HTML pour la structure, le CSS pour la mise en page, ainsi que le JavaScript.

Objectif

Réaliser un site vitrine en utilisant le CMS WordPress afin de promouvoir la marque sans pour autant y afficher les prix.

Création

J’ai utilisé le thème Divi (Elegant theme) afin de l’utilisé comme base. J’ai créé un thème enfant afin de pouvoir le modifier en toutes sécurité. Puis j’ai utilisé le HTML, CSS, et JavaScript pour l’adapter à mes besoins.

• 

• 

• 

• 

• 

• 

• 

• 

• 

Un constat

Aujourd’hui, beaucoup d’étudiants doivent réaliser un ou plusieurs stages pendant leurs études. Ces stages permettent souvent de valider leurs années mais beaucoup d’entre eux ont du mal à trouver une entreprise pour les accueillir.

Une idée

Romane Cariou et moi-même, à ce moment étudiants à l’Université de Bretagne Occidentale, eurent l’idée de réaliser une plateforme afin de permettre aux étudiants et aux entreprises de se rencontrer à un seul et même endroit.

Objectif

Notre objectif premier était donc de créer LA plateforme permettant aux étudiants de trouver rapidement et simplement leurs stages. Nous souhaitions créer une interface ergonomique pour permettre à chaque personne de se repérer facilement dès la première visite.

La création

Lors de la création de cette plateforme, nous avons lister les fonctionnalités à intégrer comme par exemple l’envoie de mail ou l’édition de CV directement depuis le site. Nous avons pensé à la première version du site, mais nous avons aussi imaginé les fonctionnalités à ajouter aux futures versions.

Nous avons ensuite imaginé puis créé le design de la plateforme afin de lui donner son identité. Nous l’avons développé et fait la communication sur les réseaux sociaux.

Design

Après avoir dessiné nos wireframes sur papier et tableau blanc, nous avons créé nos maquettes à l’aide du logiciel Adobe XD.
C’est aussi à ce moment que nous avons choisis les couleurs à utiliser. Le orange, le jaune, et le bleu/vert.

• 

• 

Développement

Pour le développement de la plateforme j’ai choisi d’utiliser le PHP et une base de données SQL pour le côté back-end. Ne pas utiliser de framework PHP était un choix.

Pour ce qui est du côté front-end, j’ai utilisé le HTML, le CSS, et le JavaScript. J’ai également utilisé le framework Materialize et le jQuery.

• 

• 

• 

• 

• 

Le client

Une équipe de guides Népalais Francophone, Chinoise et Anglophone proposant des treks, du rafting, du parapente, ou tout autres activités en créant pour vous de beaux itinéraires dans les plus belles régions du Népal.

Objectif

Réaliser un site web afin de promouvoir l’activité des guides Népalais tout en gardant à l’esprit que ce site pourrait être visible au Népal et donc qu’il soit assez léger pour un chargement rapide.

Le client souhaitait aussi que son site soit simple d’utilisation, autant pour les visiteurs que pour les administrateurs.

L’ajout d’un module de témoignages permettant à leurs clients de donner leurs avis sur les prestations est aussi demander

Solution

En accord avec le client, j’ai choisi d’utiliser le CMS WordPress pour la réalisation du projet. WordPress étant le CMS le plus utilisé au monde, mais surtout le plus simple d’utilisation pour les futurs administrateurs, ce choix me semblait être le plus interessant.

Création

En discutant avec le client, nous avons, ensemble, déterminer les éléments à insérer au site web ainsi que le design souhaité.

Nous avons également discuté et travaillé sur l’arborescence du futur site web.

Le design

Le client souhaitait des couleurs en rapport avec le pays. Le drapeau du Népal étant rouge et bleu, je devais donc les utiliser. Nous avons aussi choisi d’utiliser une petite touche de orange et un gris léger pour à la place du blanc classique.

Simple, le site est composé de pages ayant un titre, un sous-titre, une image de présentation, ainsi que deux colonnes. Une colonne contenant un texte, et l’autre colonne (plus petite) comportant des informations sur l’activité ou le lieu en question. Une carte de la région peut aussi y être affichée.

• 

• 

• 

Développement

Pour ce projet, j’ai utilisé le CMS WordPress et créé un thème sur-mesure. J’ai donc utilisé le PHP pour l’aspect dynamique. Grâce à WordPress, je n’ai pas touché à la base de données. Du côté front-end j’ai utiliser le HTML pour créer la structure. Pour le style j’ai utilisé le pré-processeur SCSS. Et enfin j’ai utiliser le JavaScript.

J’ai pris la décision d’utiliser KNACSS, un framework CSS que j’ai découvert lors de mon stage chez Koality (agence web).

Le module de témoignages

Ne trouvant pas de module de témoignages me satisfaisant, j’ai pris la décision de le développé moi même. Pour cela j’ai utilisé les custom post-type de WordPress et l’extension ACF normalement utilisé au niveau de l’administration.

En faisant plusieurs recherches j’ai découvert que le plugin ACF pouvait être utilisé en front. Le principe est simple, lorsqu’une personne publie un avis, celui-ci sera directement enregistrer dans la base de données en « brouillon ». L’administrateur pourra alors modifier le statut du poste en le passant de « brouillon » à « publié ». Il sera alors affiché sur le site.

• 

• 

• 

• 

•