Le projet se composait de la création de site Web institutionnel d'une entreprise du secteur numérique en équipe. Le site est à destination de la génération alpha qui recherche des entreprises pour faire leur stage.
Le site doit mettre en avant la transition numérique et écologique de l'entreprise du secteur numérique par son contenu et le rendu visuel. Le site doit également être codé en respectant le critère d'écoconception.
La première étape était la réalisation du recueil de besoins.
Notre équipe a attentivement étudié le
contenu du site de l'entreprise qu'on a choisi - Orange Business.
On a recueil les informations consternant
les informations générales sur l'entreprise,
les services qu'elle propose, sa transition numérique et écologique.
La deuxième étape était la conception des maquettes, plus précisément le wireframe,
grâce au logiciel Whimsical pour notre futur site. Chaque membre du groupe a réalisé
une maquette par page web : la page d'accueil, la page pour présenter l'entreprise,
les services qu’elle propose et
le formulaire de contact. On a dû se familiariser avec l’interface du logiciel Whimsical,
en créant un espace collaboratif et en explorant les fonctionnalités.
La troisième étape était le développement du site web.
On a réparti les tâches de la même façon que lors de la conception de maquette.
Chaque membre du groupe a développé la page qu’il avait conçue avant. Pour cela,
on a utilisé les langages de programmation tels que le HTML, le CSS pour coder
le site et le JavaScript pour la réalisation de certaines fonctionnalités telles
que les tabulations sur la page de services, la carte interactive avec les agences
de l’entreprise et le burger menu pour la version responsive du site. Le site s’adapte
facilement pour des écrans de taille différente grâce aux propriété de CSS Flexbox qu’on
a utilisé beaucoup. Notre équipe a travaillé
la plupart du temps à distance. Pour communiquer et s’entraider,
on a utilisé l’application de messagerie Discord.
Dans le cadre de ce projet, j’ai réalisé la première maquette de la page. d’accueil en me basant sur le recueil des besoins que nous avions rédigé en amont. Ce document nous a permis de bien définir les attentes du client. Pour concevoir la maquette, je me suis également appuyée sur le contenu du site existant. Dès le début, j’ai pris soin de reprendre la charte graphique en respectant les couleurs et les éléments visuels. J’ai aussi intégré le logo officiel de l’entreprise dans le menu. Après avoir finalisé cette première maquette, je l’ai présentée à mon équipe comme base de travail pour les autres pages du site. L’objectif était d’établir une cohérence graphique et fonctionnelle sur l’ensemble du projet, en gardant une ligne directrice commune. Cette proposition a été bien accueillie. et adoptée comme référence pour la suite de la conception. Tout au long de cette phase, j’ai échangé régulièrement avec mon équipe sur notre groupe Discord. Ces échanges nous ont permis de prendre des décisions collectives rapidement et de rester alignés. sur les choix graphiques. J’étais également disponible pour aider mes coéquipiers à résoudre certains problèmes techniques liés à design des maquettes.
J’ai ensuite développé la page d’accueil à l’aide de HTML et CSS, en y intégrant la barre de navigation commune à tout le site ainsi que les différentes sections de contenu. Une fois la page d’accueil terminée, j’ai constaté qu’elle n’était pas adaptée aux appareils mobiles. J’ai donc pris l’initiative de concevoir une version responsive, en utilisant la propriété Flexbox en CSS et un peu de JavaScript pour améliorer le comportement du menu sur les petits écrans. L’intégration au code existant a nécessité plusieurs ajustements techniques, pour lesquels j’ai effectué des recherches et des tests. Cela m’a permis de renforcer mes compétences en développement web responsive. Bien que cette amélioration ne soit pas prévue initialement, j’ai proposé à mon équipe d’adopter cette version mobile, et ma suggestion a été acceptée. Par ailleurs, je me suis chargée de la recherche et de l’optimisation des images sur la page d’accueil et la page de présentation de l’entreprise, en réduisant leur taille sans perte de qualité des images pour répondre aux exigences de sobriété écologique. Enfin, tout au long du projet, j’ai contribué à la dynamique de groupe en apportant conseils et assistance à mes coéquipiers.
Je remercie notre enseignant monsieur Nicolas Hili pour son soutien et ses conseils professionnels, qui ont permis d’orienter notre travail dans la bonne direction et d’améliorer le résultat final du projet. Je remercie également mes coéquipiers pour leur participation active et leur esprit d’équipe. Grâce à nos efforts communs, nous avons pu atteindre avec succès les objectifs fixés.
