Assoc. #Chalut

#CHALUT : Présentation

[ https://www.associationchalut.com ]

L’association Chalut a pour but de protéger les chats errants et abandonnés. Cela correspond à : Les nourrir / Leur apporter les soins nécessaires / Les faire stériliser / Leur trouver une famille ou les relâcher / Réaliser un suivi / Sensibiliser le grand public.

Demande : Refonte intégrale du site de l’association.
Type de site : Associatif.
Contenu : Actualités de l’association via fil actu Facebook, informations , Chats pour adoption.
CMS : WordPress.
CDN(s) : Bootstrap / GoogleFont / FontAwesome
Langages : Html5 / Css3 / Javascript / PHP / MysQl.

Mon rôle

• Création de la charte graphique & maquettage du site (UI/UX design).
• Front-Développement (réalisation de la beta-démonstration intégrale du site (en dur) & intégration WordPress.

Benchmarking pdf

Home-page : Mise en avant des actualités Facebook au centre de la page. L’un des objectifs principaux à été de rendre beaucoup plus visible et attractif le bouton d’appel au don.

Mise en avant des actions de l’association. Zoning indentique pour l’ensemble du site / 3 colonnes principales dont menu, contenu de page, visuel de fond plein ecran fixe & informations annexes. Sur toutes les pages internes du site, le plugin-Page Facebook se déclenche via un bouton disposé à l’écart du container principal.

Espace adoption : Liste déroulante des chats disponibles pour adoption. Un code couleur et typographique met en avant les cas urgents. Il sera possible de classer les fiches des animaux par date d’ajout ou par priorité d’adoption.

Détail d’une fiche : Le détail d’une fiche animal se compose de la photo en plan large suivi des caractéristiques en détail (bio / date d’entrée / race du chat / Age / Sexe …).

Mon #Ce-Extranet

#CE-EXTRANET : Présentation

[ Version demo « en dur » (html brut/js) ]

Sur cette plateforme, le salarié pourra gérér son espace en ligne, réserver des bons de réductions sur différentes prestations, bénéficier d’autres avantages, consulter les dates des évènements internes, et accéder librement aux publications relatives au Comité.

Demande : Etude d’une plateforme Extranet pour salariés de PME
Type de site : Extranet.
Contenu : Offres partenaires / Formulaires de commande / Compte personnel …
CMS : WordPress.
CDN(s) : Bootstrap / GoogleFont / FontAwesome
Langages : Html5 / Css3 / Javascript / PHP / MysQl.

Mon rôle

• Création de la charte graphique & maquettage du site (UI/UX design).
• Front-Développement (réalisation de la beta-démonstration intégrale du site (en dur).

Home-page : Les trois onglets principaux de la page d’accueil renvoient vers des pages dédiées aux offres de base du C.E., telles que la commande de tickets de cinema, la réservations de chèques vacances, ou la participation financière à des évènements de type sports/ loisirs (donnant droit à des tarifs préférenciels).

La section « partenaires », quant à elle , redirige vers des offres de prestations plus ciblées, notament soins du corps / parfumerie / soins du visage / Alimentaire / loisirs ect … Toutes les pages partenaires sont dotées de formulaires dynamiques assistés, dans lesquels le salarié pourra préciser ses choix, ses quantités (dans la limite autorisée …). Aucun système de paiement en ligne n’est prévu dans cette version, le règlement se fait exclusivement par chèque, après réception et validation de la commande par formulaire.

Détail d’une page partenaire : La page partenaire dédiée est munie d’un formulaire à choix multiples (commande de tickets cinema / Participation sports – Loisirs / Commande de chèques vacances et autres avantages.

Toutes les informations relatives au salarié membre sera sauvegardée dans la partie « compte ». (dernières réservations en date, messagerie, informations personnelles …)

Projet #Urbancash

URBAN-CASH - Projet de site marchand

[ Version demo « en dur » (html brut/js) ]

Achat / Vente de produits d’occasion depuis 10 ans. Téléphonie, Informatique, Jeux vidéos, Image & son, Maroquinerie, Culture, Aménagement, Services.

Demande : Création d’un site marchand pour la marque.
Type de site : E-commerce.
Contenu : Boutique en ligne (Achat & Vente).
Sites concurents : Easy-Cash / Cash-converters …
Style graphique prédominant : Flat-Design.
CMS : WordPress (avec WooCommerce à implémenter).
CDN(s) : Bootstrap / GoogleFont / FontAwesome
Visibilité : XML SiteMap à prévoir.
Langages : Html5 / Css3 / Javascript / PHP / MysQl.

Mon rôle

• Création d’un logotype, de la charte graphique & maquettage du site (UI/UX design).
• Front-Développement (réalisation de la beta-démonstration intégrale du site (en dur).

^*Le client souhaite acheter un produit en vitrine : Il accède à la boutique en ligne via la page d’accueil directement (produits mis en avant) ou en se rendant dans l’espace Achat (code couleur bleu). Des filtres de tri selon critères affinés ont été prévus.


^**Le client possède un article qu’il souhaite vendre : Il pourra simuler en ligne une estimation de rachat (selon des critères spécifiques à chaque produit – code couleur orange), ou directement passer en magasin.

Détail d’un produit : Le détail d’un produit fonctionne globalement comme le « permalien » d’un article. La boucle récupèrera respectivement les variables « image » / « titre » / « nom de produit » / « détail » ext … A partir de cette étape, il est possible d’ajouter le produit à la liste de vente, si l’on possède déjà cet article / ou l’ajouter à la liste d’achat si l’on souhaite l’aquérir. Ces deux listes figurent dans la partie Compte client. Un carousel de suggestions de produits similaires est prévu en bas de la page.

Agence #Multimodal

MULTIMODAL - Site web de l'agence

[ https://www.agence-multimodal.fr ]

Multimodal, un pôle de compétences en Marketing & Communication globale : Edition, identité visuelle, charte graphique / Multimédia & / Web design / Marketing opérationnel / Audiovisuel.

Demande : Création du site portfolio de l’agence.
Type de site : Catalogue.
Contenu : Vitrine de l’agence (One-page – Ancres vers sections).
CMS : WordPress.
CDN(s) : Bootstrap / GoogleFont / FontAwesome
Langages : Html5 / Css3 / Javascript / PHP / MysQl.

Mon rôle

• Déclinaison de la charte graphique & maquettage du site (UI/UX design).
• Front-Développement & Création d’un thème wordpress dédié.
• Mise en ligne & suivi du site.

header / Haut de page : Menu « smooth-scroll effect » lié aux aux ancres de section de page. Niveau de lecture par défaut : fond d’ecran fixe & logotype de l’agence.

Première section : Texte d’introduction, accompagné de pictogrammes présentant brièvement les principales activités de l’agence. On privilégie ici les grands espaces photos afin de véhiculer rapidement un concept ou une émotion.

Deuxième section : Plus de détails sur les prestations de l’agence. Courtes descriptions sous forme de liste sur fond noir transparent. L’image d’arrière plan reste en position fixe, afin d’attirer l’oeil sur le contenu scrollé.

Troisième section : Portfolio de l’agence, illustré de deux manières différentes : un carousel défilant, placé stratégiquement en tête de section, décrivant rapidement des ambiances. Les différentes slides pointent directement sur un site web.

Au dessous se place une vitrine de visuels cliquables. (1 par projet, ouvrant chacun une fenêtre plein ecran contenant un descriptif enrichi.