Conseil technique pour la refonte du site pour le transformer en une application web.

Analyse du projet Ethipop

http://www.ethipop.com/

1 Audit de l’existant

1.1 Le site :

Ethipop possède un site conçu avec le CMS Squarespace.  C’est un site pratique à l’usage et moderne. Son objectif réside principalement dans la communication de la structure et de ses fondements à savoir son histoire et ses valeurs. En revanche Squarespace est un SAAS (Software as a Service) ce qui signifie qu’il n’est pas téléchargeable et il ne peut pas , par conséquent, être modifié par un développeur. Les services qu’il propose sont basiques et se limitent à l’édition de contenus de type blog ou e-commerce. Il est impensable d’utiliser  Squarespace pour la création d’une plate-forme à part entière.

1.2 L’architecture

Le site possède  une dizaine de pages et une dizaine d’articles de blog qu’il faudra migrer et rediriger pour ne pas perdre le référencement.

1.3 Le graphisme

Ethipop possède une identité graphique forte, mise en valeur par des backgrounds organiques et très graphiques et une police qu’il faudra doit garder. Son logo est élaboré par ces éléments.

Le site utilise un template par défaut avec une barre de navigation sur le côté gauche.  

1.4 Les utilisateurs

Un formulaire d'inscription à la newsletter indique qu’il faudra faire une migration des users.

1.5 Le contenu

Il y a une masse importante de texte et d’image qu’il serait intéressant de réutiliser pour garder le référencement.

2. Nouveau projet de Ethipop

Création d’une plate-forme de communication

Création d’une plate-forme contributive de créateurs de mode

Un espace e-commerce

2.1 Quels sont les objectifs de la plate-forme?

Cet inventaire est établi d’après l'analyse de l’existant, le PDF fournit par Ethipop et les sites qui ont inspirés la structure :

http://projectjust.com/

https://www.provenance.org/   

Les principaux objectifs sont :

Communiquer :

  • les ventes éphémères 
  • des articles de blog (autour de la mode dans un système de l’économie sociale et solidaire)
  • promouvoir les créateurs associés à Ethipop. 
  • des événements organisés par la structure.
  • les valeurs grâce au manifesto.
  • les récupérables, la marque phare de Ethipop
  • l’histoire de Ethipo, un espace dédié au storyteling.
  • le nouvel espace d’incubateur.
  • les références d’article de presse.

Fédérer des créateurs

Créer un espace pour que chaque créateur puisse présenter sa marque et ses produits. Lors de l’enregistrement et de la configuration des profils, l’utilisateur devra remplir une suite de champs pour constituer une base de donnée. Les données récoltées, sous forme de termes de taxonomie serviront à l’élaboration d’un algorithme

Vendre

Création d’une plate-forme de e-commerce.

Grâce à une gestion des rôles d’utilisateurs, les créateurs pourront déposer des articles à vendre, qui seront soumis à une modération, pour garantir une qualité d’affichage et une cohésion avec les valeurs de la structure.

Moteur d'impact

Création d’un algorithme qui calcule l’empreinte carbone pour chaque produit de la structure grâce aux données récoltées dans le formulaire du profil utilisateur.

2.2 Avons-nous les mêmes objectifs entre la version mobile et la version desktop?

Aujourd’hui il existe une multitude de thèmes responsive, qui s’adaptent très bien à tous les supports pour un visionnage optimisé des sites web.

Une question pertinente peut être celle-ci : “est-ce-que je regarde la même chose sur mon téléphone que sur mon mobile?” et si la réponse est négative alors je peux me poser la question sur les contenus à privilégier pour la version mobile.  

En attendant une analyse plus poussée sur la stratégie de Ethipop liée à une analyse sur les comportements  des utilisateurs face à leur mobile, la plate-forme sera développé avec un template responsive qui fait référence dans le monde du développement : Boostrap.      

3 Les phases de développement

Proposition de Laura dans son dernier mail :

- Algorithme avec calcul de l'impact  (V0-V1) > échange à monaitisé

- Back office créateur profil simple (V2)

- Back office créateur sur le e-shop (V3-V4)

Proposition de Wexample:

V1 Migration du site sur un Drupal

La base

Utilisation du CMS Drupal car il est optimisé pour la gestion de plate-forme imposante et puissante, notamment grâce à la gestion de la BDD et des termes de taxonomies, et à la gestion des utilisateurs. Drupal commerce fait également référence dans le domaine du e-commerce.

Exemple de sites Durpal français remarquables :

http://www.actioncontrelafaim.org/

http://www.novaplanet.com/

http://www.caf.fr/ > C’est dire la puissance de la gestion des users !

Et voir plus http://www.drupalons.fr/exemples-de-site-drupal-importants

Drupal est Européen, open source et totalement gratuit qui fait référence dans la création des plate-formes web. Wexample à la chance de compter parmi ses membres un Drupalien de la première heure, Romain Weeger, qui sera l’expert technique du projet.

Partie graphique

Utilisation du template boostrap pour avoir une bonne base pour le responsive.

Modification du template de base pour retrouver l’univers graphique de Ethipop.

Création de l’architecture > Pages - header - footer - navigation.

Création de la home > affichage dynamique et moderne.

Reproduction et redirection de toutes les pages et les articles du site.

Création d’un template de blog.

Gestion des utilisateurs

Création des rôles éditeurs - super éditeurs en fonction des compétences et des besoins de chacun.

Gestion des droits et des affichages pour chacun.

Hébergement

Hébergement du site et récupération du DNS de Squarespace

Installation sur les serveurs

SEO

Installation du multilingue et traduction des contenus.

Redirection des URL.

Partage sur les réseaux sociaux (OG image).

Gestion des mots clés et des balises alt.

Inscription Google Analytics et Google Search.

Réseaux sociaux

Connexion du site à tous les réseaux sociaux.

Bouton share.

Galerie Instagrame.

Newsletter

Migration des abonnés.

Ajouter un formulaire d'inscription.

Édition des lettres et mise en place des scénarios de première catégorie.

Formation à l’édition de contenu sur le backoffice Drupal

Création des info bulles pour aider les éditeurs à travailler le backoffice.

Inscription sur le slack de Wexample pour avoir un suivi et une formation avec le webmaster charger du projet.  

V2 Création du profil utilisateur

Création du template à partir de Boostrap et du travail exécuté en amont.

Formulaire d’inscription.

Formulaire de désinscription.

Automatiser le protocole d'adhésion à la structure entre la demande et l'acceptation.

Déterminer les droits de cet utilisateur.

Lister et intégrer toutes les possibilités de customisation du profil.

Créer des info bulles pour aider pour faciliter l’UX.

V3 Création de l’espace e-commerce

Intégration de Drupal commerce et configuration des plugins.

Déterminer le protocole de mise en vente pour pouvoir l’automatiser.

Mise en place de la modération.

Connexion du site au service bancaire.

V4 Création de l’algorithme d'impact de l’empreinte carbone

Création de l'algorithme en fonction des critères choisi.

Mise en forme et affichage sur le site.  

V5 Optimisation mobile

Création d’une application mobile à part entière.

Carole LAVOCAT