Session 2016-2017

Projet personnalisé encadré

Julien Signat

Nicolas Herfray

Société La Fleur

1

Table des matières

Table des matières ..................................................................................................... 1

Documentation disponible : Site marchand – Cas Lafleur .......................................... 2

Documentation disponible : Société La Fleur – Projet personnel encadré ................. 2

Compétences développées ........................................................................................ 3

Rappel sur les langages ............................................................................................. 5

Choix de la charte graphique ...................................................................................... 6

2

Documentation disponible : Site marchand – Cas Lafleur

Documentation disponible : Société La Fleur – Projet personnel encadré

3

Compétences développées

A1.1.1 Analyse du cahier des charges d'un service à produire C1.1.1.1 Recenser et caractériser les contextes d'utilisation, les processus et les acteurs sur lesquels le service à produire aura un impact Société fictive La Fleur réalisée dans le cadre d’un projet personnalisé et encadré au cours de l’année BTS SIO option Slam C1.1.1.2 Identifier les fonctionnalités attendues du service à produire

Document de synthèse : Site marchand – Cas Lafleur A1.1.3 Étude des exigences liées à la qualité attendue d'un service C1.1.3.1 Recenser et caractériser les exigences liées à la qualité attendue du service à produire Rappel sur le cahier des charges A1.2.4 Détermination des tests nécessaires à la validation d'un service C1.2.4.1 Recenser les tests d'acceptation nécessaires à la validation du service et les résultats attendus Utilisation du Markup validation language W3C Tests réalisés tout au long du projet et évolution de ses différentes versions

A1.3.4 Déploiement d'un service C1.3.4.3 Mettre en exploitation le service A1.4.1 Participation à un projet C1.4.1.2 Rendre compte de son activité Suivi de notre activité dans le cadre du BTS SIO option Slam Réalisation de ce projet personnalisé et encadré REALISER UN GANTT pour valider un C1.4.1.1 A4.1.1 Proposition d'une solution applicative C4.1.1.1 Identifier les composants logiciels nécessaires à la conception de la solution Description de la solution applicative dans ce dossier Solution disponible sur portfolio juliensignat.fr et nicolasherfray.wordpress.com

Logiciels utilisés : - XAMPP - Notepad ++ - Paletton.com - W3C markup validation service - Photofiltre - PHP myadmin - Apache server

A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative C4.1.2.1 Définir les spécifications de l'interface utilisateur de la solution applicative

Description de l’architecture de la solution applicative dans ce dossier et sur le portfolio de Julien et de Nicolas

C4.1.2.2 Maquetter un élément de la solution applicative Charte graphique C4.1.2.3 Concevoir et valider la maquette en collaboration avec des utilisateurs

Travail réalisé et validé en cours

A4.1.3 Conception ou adaptation d'une base de données C4.1.3.1 Modéliser le schéma de données nécessaire à la mise en place de la solution applicative Schéma de données C4.1.3.2 Implémenter le schéma de données dans un SGBD CF PHPADMIN C4.1.3.3 Programmer des éléments de la solution applicative dans le langage d'un SGBD

Base de données opérationnelle et conforme aux spécifications et à la législation C4.1.3.4 Manipuler les données liées à la solution applicative à travers un langage de requête Imprime écran des requêtes

4

A4.1.6 Gestion d'environnements de développement et de test C4.1.6.1 Mettre en place et exploiter un environnement de développement Spécifications techniques disponible dans ce dossier Outil de développement utilisés : Notepad++ A COMPLETER C4.1.6.2 Mettre en place et exploiter un environnement de test Utilisation du Markup validation language W3C Tests réalisés en cours ? A4.1.7 Développement, utilisation ou adaptation de composants logiciels C4.1.7.1 Développer les éléments d'une solution C4.1.7.2 Créer un composant logiciel C4.1.7.3 Analyser et modifier le code d'un composant logiciel C4.1.7.4 Utiliser des composants d'accès aux données JOINDRE PLUSIEURS IMPRESSION ECRAN POUR CES 4 POINTS A4.1.10 Rédaction d’une documentation d’utilisation C4.1.10.2 Adapter la documentation d’utilisation à chaque contexte d’utilisation C4.1.1.1 Identifier les composants logiciels nécessaires à la conception de la solution PHP HTML Paletton.com XAMPP Control Panel v3.2.2 MySQL Notepad++ W3C markup validation

5

Rappel sur les langages

1/ Langage HTML

L’HyperText Markup Language, généralement abrégé HTML, est le format de données conçu pour représenter les pages web. C’est un langage de balisage permettant d’écrire de l’hypertexte, d’où son nom. HTML permet également de structurer sémantiquement et logiquement et de mettre en forme le contenu des pages, d’inclure des ressources multimédias dont des images, des formulaires de saisie, et des programmes informatiques. Il est souvent utilisé conjointement avec le langage de programmation JavaScript et des feuilles de style en cascade (CSS). HTML est initialement dérivé du Standard Generalized Markup Language (SGML). Source : Wikipédia

2/ Langage PHP

PHP : Hypertext Preprocessor4, plus connu sous son sigle PHP (acronyme récursif), est un langage de programmation libre5, principalement utilisé pour produire des pages Web dynamiques via un serveur HTTP4, mais pouvant également fonctionner comme n'importe quel langage interprété de façon locale. PHP est un langage impératif orienté objet. PHP a permis de créer un grand nombre de sites web célèbres, comme Facebook, Wikipédia, etc.6 Il est considéré comme une des bases de la création de sites web dits dynamiques mais également des applications web. Source : Wikipédia

3/ Langage JavaScript

JavaScript est un langage de programmation de scripts principalement employé dans les pages web interactives mais aussi pour les serveurs2 avec l'utilisation (par exemple) de Node.JS. C'est un langage orienté objet à prototype, c'est-à-dire que les bases du langage et ses principales interfaces sont fournies par des objets qui ne sont pas des instances de classes. JavaScript a été créé en 1995 par Brendan Eich. Il a été standardisé sous le nom d'ECMAScript en juin 1997 par Ecma International dans le standard ECMA-262. Le standard ECMA-262 en est actuellement à sa 7e édition. JavaScript n'est depuis qu'une implémentation d'ECMAScript, celle mise en œuvre par la fondation Mozilla. L'implémentation d'ECMAScript par Microsoft se nomme JScript, tandis que celle d'Adobe Systems se nomme ActionScript. Source : Wikipédia

6

Choix de la charte graphique

La charte graphique dont la dénomination correcte est cahier des normes graphiques est un document de travail qui contient l'ensemble des règles fondamentales d'utilisation des signes graphiques qui constituent l'identité graphique d'une organisation, d'un projet, d'une entreprise. Le terme vient du latin charta qui signifie « papier » et qui en français a pris le sens de « loi, règle fondamentale ». Source : Wikipédia. Suite à la veille concurrentielle effectuée dans le cadre du projet personnalisé et encadré (cf. PowerPoint Veille concurrentielle), nous avons retenu : Une image de fond pour le site :

Un logo pour la société La Fleur : Et un favicon symbolisant le site :

7

Pour la concordance des couleurs, nous avons utilisé le site Paletton.com :

Structure général du site La Fleur source (source : Certa.org) :

8

Aperçu définitif :

Validation par le markup validation service W3C : https://validator.w3.org/ :

9

Extrait de code :

10

Formulaire d’inscription sur le site LaFleur :

11

Suite à votre inscription, le message suivant s’affiche :

Suite à votre inscription, vous pouvez vous connecter :

Produit disponible sur le site La Fleur :

12

Récapitulatif de votre commande, si vous n’est pas connecté un lien vous permettra de le faire ou de vous inscrire sur le site :