site web centrale eco

Charlotte DemayEmilie Leduc

Clémence DecugisMickaël Dubucq

Centrale Eco

Plateforme d’achatsde produits de développement durable

destinée aux entreprises

Site Web

• Zoom sur Centrale Eco– Ce que propose Centrale Eco– Modèle économique

• Site web de Centrale Eco– Etudes préalables– Gantt– Architecture– Storyboard– Charte graphique– Technologies employées– Outils utilisés– Site web php, xhtml et css

• Démonstration du site web– Navigation– Accessibilité– Enregistrement en vue d’un achat– Achat d’un produit– Gestion de la plateforme E-Commerce

Centrale Eco Offre modèle économique / Site Web / Démonstration

Comment pénétrer le marché des produits de développement durable sans prendre de risques qu’ils soient financiers ou humains ?

Plateforme d’achats

Solution de e-logistique

Notre solution en marque blanche

Formations

Conseils

Centrale Eco Offre modèle économique / Site Web / Démonstration

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Définition de l’audience

Notre cible

Pourquoi viendraient-ils le consulter?

Les informations recherchées

Leurs besoins

Nos points forts

Etude de la concurrence

Style Rapidité Navigation Design Ergonomie Fonctionnalités Contenu Interactivité

ConsoGlobe ++ ++ + + + - ++ -

Econology - + ++ -- - ++ + --

Solidar Monde ++ - - ++ ++ + + +

Achats Concepts Eco

+++ ++ - + ++ + ++ +

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Détermination de l’objectif

Pourquoi créer ce site?

Moyens mis en œuvre

Notre ligne directrice

Votre plateforme d’achats de produits de développement durable

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Accueil

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Qui sommes-nous?

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Notre offre

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Zone

adhérent

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Nous contacter

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Largeur des pages : 1024px

Hauteur des pages : 800px

Mode d’alignement des pages dans la fenêtre de navigation : Centré / Float Center

Police de caractère : Verdana sans shérif

Code couleur: dégradé de vert et de bleu

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Page d’accueil

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Autres pages

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Sky blue Deep sky blue Light sea green Pale green Yellow green Sea green#87ceeb #00bfff #20b2aa #98fb98 #9acd32 #2e8b57

Etude chromatique

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Eléments graphiques

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Eléments graphiques

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Typographie

Bradley hand ITC, 14 pts et 12 pts

Centrale Eco, une plateforme d’achat innovante.

A l’instar de beaucoup d’entre nous, je me sens plus que jamais concernée par la cause du développement durable.

Verdana ; 12 pts

Verdana bold; 16 pts

Verdana bold; 16 pts

Technologies employées:

Xhtml

Base de données MySQL: gestion des ressources,

des produits, des contacts, des clients…

PHP: créer un formulaire

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Outils utilisés:

Xhtml : Dreamweaver

Base de données MySQL: PHPmyAdmin

PHP: Bloc note

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

1. Type de commande<form method="POST" action="nadform.php" name="AVIS">

2. Elaboration du formulaire<input type="text" name="champ1" size="20">

<p>Votre prénom :<br><input type="text" name="champ2" size="20"></p>

<p>Email :<br><input type="text" name="champ4" size="20"></p>

<p>Vous voulez :<br><br/><input type="radio" name="champ7" value="Reponse7_2">avoir accès au catalogue sans devenir client</p><input type="radio" value="Reponse7_1" name="champ7">commander des produits et devenir client</p><br/><br/><input type="radio" name="champ7" value="Reponse7_3">devenir fournisseur</p>

<p>Laissez-nous un message...<br><textarea rows="4" name="champ6" cols="40"></textarea></p>

<input type="submit" value="Envoyer" name="envoyer">;<input type="reset" value="Recommencer" name="recommencer">

Comment nous contacter? Code dans HTML

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

1. Fonction de contrôle du mail$MailTo = "mickaeldubucq@hotmail.com"; //adresse à laquelle sera envoyé le contenu du formulaire$MailSubject = "nouveau contact centrale eco"; //texte qui va figurer dans le champ "sujet" du email$MailHeader = "$champ4"; //adresse email qui va figurer dans le champ "expéditeur" du mail

2. Attribuer une valeur aux variables et les stocker dans la variable MailBody (message) if ($champ1 == ""){ echo("Vous n'avez pas complete le champ NOM.<br>"); //message qui s'affiche si le visiteur n'a pas rempli ce

champ $Envoi = 0; //si le champ1 n'a pas été rempli, la variable envoi prend la valeur de 0 }else { $MailBody .= "Question 1 : $champ1\n"; //si le champ1 contient de l'information, elle est stockée dans la variable MailBody}

if ($champ2 == ""){ echo("Vous n'avez pas complete le champ PRENOM.<br>"); $Envoi = 0; }else { $MailBody .= "Question 2 : $champ2\n"; }

if ($champ4 == ""){ echo("Vous n'avez pas complete le champ EMAIL<br>"); $Envoi = 0; }else { if (check_mail($champ4)) { $MailBody .= "Mail : $champ4\n"; }else { echo("L'adresse e-mail n'est pas valide<br>"); $Envoi = 0; }

$MailBody .= "Votre texte : $envoi_champ6\n";}

if ($champ7 == ""){ echo("Que voulez vous faire?<br>"); $Envoi = 0; }else { $MailBody .= "Question 7 : $champ7\n";}

Comment nous contacter? (2) Code dans Nadform.php

Centrale Eco / Site Web Etudes Gantt Architecture Storyboard Charte graphique

Technologies Outils Php, Xhtml, CSS / Démonstration

3. Envoi du message

if ($Envoi == 1) { //vérification que la variable envoi est bien à 1

echo("<p><strong>Votre nom ou pseudo : <font color=\"#0000FF\">$champ1</font>\n");echo("<br>Votre prenom : <font color=\"#0000FF\">$champ2</font>\n");echo("<br>Votre email : <font color=\"#0000FF\">$champ4</font>\n");echo("<br>Votre texte : <font color=\"#0000FF\">$affich_champ6</font>\n");echo("<p>&nbsp;</p>");

mail($MailTo, $MailSubject, $MailHeader); //envoi du message

echo("<p>Votre message a bien ete envoye.<br>Merci de vos commentaires.");echo("<p>&nbsp;</p><p>&nbsp;</p><p align=\"center\"><a href=\"contact.html\">Retour</strong></a></p>");

//affichage d'un message de confirmation.}?>

Comment nous contacter? (3) Code dans Nadform.php

Navigation

Accessibilité

Enregistrement en vue d’un achat

Achat d’un produit

Gestion de la plateforme E-commerce

Centrale Eco / Site Web / Démonstration

Merci de votre attention…

Avez-vous des questions?