Elodie Bayet :: Développeuse Web Fullstack & UI/UX Designer

ProductionsTrade Concept – Site web

Trade Concept : le site web

Site vitrine d’entreprise :: Trade Concept

Technologies

  • JavaScriptIcon JavaScriptJavaScript
  • HTML 5Icon HTML 5HTML 5
  • CSS 3Icon CSS 3CSS 3
  • PHP 8Icon PHP 8PHP 8
  • MySQLIcon MySQLMySQL
  • SQLIcon SQLSQL
  • XMLIcon XMLXML
  • Adobe IllustratorIcon Adobe IllustratorAdobe Illustrator
  • Adobe PhotoshopIcon Adobe PhotoshopAdobe Photoshop
 

Développement web fullstack

La mission

Pour une société industrielle située à Andrimont et ayant pour secteur d'activité la construction de modules de chantier, l'installation de bases de vie, la vente et la location de dispositifs d'énergies, de bateaux et de machines d'ingénierie civil au Congo, au Gabon et en Tanzanie.

Programmation Front-End et Back-End

La totalité du site est entièrement développé en HTML, CSS, JavaScript et PHP et remplace l'ancienne version qui était très archaïque et très limitée en interactivité.

Les clients de la société sont majoritairement francophones et anglophones, la page d'index propose donc un accès rapide vers chaque secteur d'activité dans la langue adéquate. Le site comporte 4 secteurs auxquels sont attribués un code couleur et un contenu spécifique dynamiquement chargé par PHP.

Les différents pays d'Afrique étant parfois limités en système d'exploitation et en connexion, tout le site est compatible avec Internet Explorer 7, accessible sans le JavaScript, et adapté aux différents formats d'écrans desktop / laptop / mobile.

Infographies interactives

Les pages les plus imposantes sont celles des Infographies interactives et des graphiques comparatifs liés aux conteneurs. Elles se composent de schémas découpés en multiples images, et elle est développée en HTML/CSS afin d'offrir un meilleur retour quand au référencement naturel. On y retrouve les codes couleurs exploités dans la brochure.

Les pages consacrés aux services offrent également un côté interactif via les infographies comparatives des gammes de modules. Un programme JavaScript permet de sélectionner une gamme et ensuite de survoler les quartiers pour y afficher les détails techniques. Chaque gamme révèle de plus en plus de quartiers, et donc de plus en plus de spécificités.

 
Aperçu de la page racine avec panneau de sélection langue
Page index
Page accueil sur les actualités de l'entreprise
Page actualités
Description gammes conteneurs avec inforgraphies JavaScript
Page gammes de conteneurs
Description conteneurs maritimes avec schémas interactifs
Page conteneurs maritimes
Page produits conteneurs base vie avec vignettes cliquables
Page produits
Détails des produits disponibles pour conteneurs base vie
Page produits base de vie
Inforgraphie interactive JS sur conteneurs gamme standard
Page services gamme standard
Inforgraphie interactive JS sur conteneurs gamme chantier
Page services gamme chantier
Inforgraphie descriptive sur engins maritimes
Page services maritimes
Page de contact avec formulaire sécurisé
Page contact
L’univers artistique de La Dame Noire
Trade Concept : l’identité