Premier projet du cours de projet web avec un vrai client.
Ce projet consiste à créer un site web, ce site permettra aux organisateurs de l’évènement « Saint Léon’Art » de communiquer avec les potentiels visiteurs et artistes et de mettre en avant cet évènement et tous ceux qui en découlent.
Le projet va être soumis à plusieurs étapes avant d'atteindre sa forme finale. Lorsque vous allez rendre le projet, il vous sera demandé d'y annexer un dossier reprenant toute votre logique, recherches et plans élaborés tout au long de toutes ces étapes :
- définition : Pour qui ? Que mettre en avant ? Quel ton ? Comment s'y prendre ? ... En gros: planifier.
- stratégie : De quelle(s) manière(s) puis-je faire passer le message du client, sa stratégie marketing ou sa manière de communiquer dans une interface web ? Est-ce que tous ses objectifs ont la même importance ? Quelle action veut-on que l'utilisateur entreprenne et comment puis-je augmenter l'efficacité de cette action ? Comment réaliser un design émotionnel pour ce public, cette thématique et le délais donné ?
- s'inspirer : À ce stade, beaucoup d'idées ont déjà traversées votre esprit. Il est temps de trouver des références. Comment s'est démarquée la concurrence, où sont les points faibles sur les sites similaires, liés, partenaires, et surtout sur l'ancien ? Structurer : Créer un plan du site, créer des schémas de navigation, définir une logique pour les URIs, hierarchiser le contenu.
- wireframes : sur base de toutes les informations récoltées et les structures définies, il faut schématiser le produit final. Il n'est pas question de s'attarder sur des questions de goûts et de couleurs. On crée une maquette en noir et en blanc, sans textes ni images. Vous êtes un(e) architecte du web, il faut prévoir, définir les zones, créer le concept de base du site. Si possible, cette étape comprend aussi une réflexion sur l'adaptation mobile du site (s'il n'était pas déjà prévu à la base, dans une optique mobile-first).
- design : Maintenant qu'on a toute la structure, on peut commencer à la peindre. C'est maintenant que vous allez définir tout le visuel du site. C'est la partie que le client comprend le mieux, qu'il peut juger lui-même. Autant dire que, dans un monde idéal, c'est ici que vous allez jouer toute l'efficacité du développement du site. Une coquille dans le design, et vous risquez d'en baver lors des étapes suivantes, surtout si le client n'a pas donné son feu accord sur l'ensemble du visuel.
- développement front-end : en français, lorsqu'on parle de l'intégration d'un site web, on parle aussi de découpe. Surtout dans le cas d'un développement front-end en vue d'être utilisé dans un CMS. Lorsqu'on est habitué à cette étape, on la mélange souvent directement avec l'étape suivante pour un gain de temps. Mais cette pratique n'est recommandée qu'uniquement lorsqu'on connaît le CMS ou le framework final en question. Ici, pour une première fois, je vous demanderai (pour votre bien) de commencer par une découpe pure, c'est-à-dire de créer le site web en HTML, CSS, JavaScript et avec la version responsive. Il s'agit donc préparer toute la partie visuelle du site et la rendre utilisable, mais sans se soucier du CMS, des base de données, etc.
- développement back-end : Le site peut désormais être transformé en un thème utilisable par le CMS en question. Dans le cadre de ce projet, et vu qu'on le verra ensemble lors du cours, il vous sera demandé d'utiliser WordPress. Une fois cette étape finie, le site devrait être fini: administrable par une interface en ligne, maintenable via une base de données, prêt à être livré au client.
- check-up & conclusions. Trop souvent oublié, cette étape vise à clôturer un projet d'une par un check-up complet. Pour ce faire, n'hésitez pas à faire appel à des testeurs (et de préférence des personnes correspondant aux différents publics ciblés). Notez tout. Chaque détail compte, et jouera en votre faveur (ou non) lorsque le client voudra vous recommander (ou non) auprès de ses éventuelles connaissances. Enfin, n'oubliez pas de rédiger une conclusion sur votre expérience sur ce projet. Êtes-vous arrivé au résultat que vous espériez lors des premières étapes ? Quels points auriez-vous attaqué différemment, maintenant que vous avez un peu plus de recul ? Quels aspects pourraient encore être améliorés ?
Saint Léon'Art
2015
Quartier Saint-Léonard Liège
- Le quartier et ses habitants mais pas que.
En septembre 2018, le parcours artistique sera organisé pour la quatrième fois.
- https://www.rtbf.be/info/regions/liege/detail_liege-saint-leon-art-un-parcours-artistique-melant-artistes-et-habitants-du-quartier?id=9385430
- https://www.quefaire.be/saint-leon-art-parcours-720481.shtml
- http://www.saint-leonard.be/2017/09/15/saint-leonart-projet/
- http://www.legaragecreativemusic.com/agenda/saint-leon-art-parcours-artistique.html
- Macadam Party & Lancement de l'appel à candidature
- Quand : 24/09/2017
- Où : Place Vieille-Montagne, 4000 Liège
- Lien Facebook
https://www.pinterest.com/closqueteric/saintleonart/
- http://www.laboverie.com/
- http://www.prehisto.museum/
- https://www.fine-arts-museum.be/fr
- https://www.artelagunaprize.com/
- https://www.brusselsmuseums.be/fr/
- TODO
Le logo est fourni
TODO
Saint-Léon’Art vise à favoriser la rencontre entre la population du quartier, largement multiculturelle, et l’art sous toutes ses formes, tout en créant des liens durables entre habitants et artistes qui s’y côtoient chaque jours. Cette initiative souhaite également rendre l’art, l’artiste et la culture accessibles à tous, toutes origines, toutes classes sociales confondues, en offrant un accès libre et gratuit à l’événement.
- Accueil
- Évènements
- filtre lieu
- filtre date
- filtre heure
- filtre catégorie
- Fiche d'un évènement
- Artistes
- filtre lieu
- filtre date
- filtre heure
- filtre catégorie
- Fiche d'un artiste
- À propos
- Contacter (formulaire)
- Partenaires
- Pratique (google map)
- Un évènement (Saint Léon'Art)
- Des activités
- Des artistes
- Search bar avec filtre dans une section
-
taille de polices (ratio) 1.500x
-
labeur : 18px / 1em
-
(h4 : 1.25 ou 22.5px)
-
h3 : 1.5em ou 27px
-
h2 : 2.25em ou 40.5px
-
h1 : 3.375em ou 60.75px (page)
-
h1 : 5.063em ou 91.125px (site)
-
hauteur de police : 1.5em
-
inter paragraphe : 0.7em
-
interbloc : ...
-
grille : ...
-
grille totale = ...
- #821d49 Claret
- #fdc848 Bright Sun
- #c22717 Thunderbird