betagouv / mission-transition-ecologique

Application Transition Ecologique des Entreprises
https://mission-transition-ecologique.beta.gouv.fr/
GNU Affero General Public License v3.0
7 stars 7 forks source link

Intégration des nouvelles colonnes avec les 🔗 liens URL pour chaque étape #601

Closed ColineLebaratoux closed 6 months ago

ColineLebaratoux commented 8 months ago

ticket design lié #498


Problématique 1/4 des dispositifs nécessiteraient des liens externes pour compléter la description. Or aujourd'hui, soit on n'intègre pas ces liens et c'est à l'utilisateur de mener l'enquête, soit on intègre un lien non cliquable dans le corps du texte (bad UX) Voir la page notion


Proposition design dev front Ajouter des CTA contextualisés en dessous des étapes en question

🖥 maquette écran large 📱 maquette mobile Version standard Image

Version avec un maximum de liens (rare) Image


Ce ticket doit être réalisé après le ticket lié data #601 Ce ticket doit être réalisé avant https://github.com/betagouv/transition-ecologique-entreprises-widget/issues/395 consistant à supprimer le formulaire de contact

ttdm commented 6 months ago

Voici la liste des liens problématiques pour cet ajout initial de liens :

🖊️ baisse-les-watts.yaml / lien 1.1 : Le lien redirige actuellement vers la page d'accueil de baisse-les-watts. 🖊️ formations-du-cfde.yaml / lien 1.1 : code 403 "interdit" mais il me semble que c'est OK ? 🖊️ formations-tee.yaml / lien 1.1 : code 403 "interdit" mais il me semble que c'est OK ?

Il faut aussi voir comment on fait pour les fichiers que l'on doit héberger nous même. C'est quelque chose qui doit rester très ponctuel et qui sera manuel pour les devs ? Est ce qu'une "dropbox beta-gouv" utilisable par tous les membres du projet serait acceptable ? (j'imagine que l'addresse serait alors plus générique comme fichiers.gouv.fr)

ColineLebaratoux commented 6 months ago

hello @ttdm

🖊️ baisse-les-watts.yaml / lien 1.1 : Le lien redirige actuellement vers la page d'accueil de baisse-les-watts. => C'est ok, il s'agit d'un lien tracké https://www.baisseleswatts.fr/?mtm_campaign=missiontransitionecologique&mtm_source=missiontransitionecologique&mtm_medium=missiontransitionecologique&mtm_content=missiontransitionecologique 🖊️ formations-du-cfde.yaml / lien 1.1 : code 403 "interdit" mais il me semble que c'est OK ? > ce lien fonctionne non ? https://www.cci.fr/ressources/developpement-durable/cfde/nos-formations

🖊️ formations-tee.yaml / lien 1.1 : code 403 "interdit" mais il me semble que c'est OK ? = ce lien fonctionne aussi chez moi : https://universite.bpifrance.fr/Account/login

ColineLebaratoux commented 6 months ago

Pour la question des liens à héberger, @pierrecamilleri avait évoqué Github

ColineLebaratoux commented 6 months ago

@ttdm c'est bon j'ai supprimé et remplacé par des liens les 4 fichiers que j'avais temporairement hebergé sur notion

ttdm commented 6 months ago

@ColineLebaratoux : Par rapport aux logos des liens, je pensais que c'était lié au format : pdf/docx.. = téléchargement avec logo et positionnement logo différent des pages web classiques.

Je viens d'aller voir dans l'excel et il n'y a plus un seul élément où la colonne téléchargement vaut 1.

Si je comprend bien, tu avais imaginé la colonne plutôt par rapport aux fichiers que l'on devait potentiellement héberger nous même ? Du coup on supprime les 6 colonnes téléchargements du fichier excel et le traitement qui va avec ? Et je fais quand même le petit jeu sur les icones ou pas ? image image

ColineLebaratoux commented 6 months ago

Hello @ttdm ! Oui tu as raison, maintenant que tous les liens sont des liens externes, on peut supprimer la colonne dédiée et utiliser un unique picto. Tant mieux, ça simplifie les choses !

Quelques retours :

Image

Merci !

ttdm commented 6 months ago

https://tee-preprod-pr689.osc-fr1.scalingo.io/aides-entreprise/bonus-ecologique

C'est bon pour toi @ColineLebaratoux ?

ColineLebaratoux commented 6 months ago

C'est top @ttdm ! Il y a juste une petite correction d'alignements au niveau des étapes (cf maquette ci dessus)

Image

ttdm commented 6 months ago

C'était l'alignement qu'on avait en prod en ce moment ;)

Je viens de faire une modif rapide. C'est mieux mais c'est pas au pixel. La différence est à mon avis invisible. Il y a un peu plus de travail si on veut vraiment être au pixel (l'ancien code n'utilise pas le système de marge du dsfr mais des marges manuelles qu'il faudrait convertir pour être au pixel).

ColineLebaratoux commented 6 months ago

Super, merci beaucoup ! Je passe le ticket en "valid"