Modules modulables pour meubles modulaires

Transcription

1 Modules modulables pour meubles modulaires Alexandre Blanchard [GSM01] Pierre Antoine Cretin [GB04] Camille Lannay [GSU05] Philibert Maniez [GI01] SI28 [UTC] A08

2 2 SYNOPSIS 1. CONCEPT Le site internet constituant le projet est lié à un concept de mobilier modulaire et modulable proposé par deux étudiants en arts appliqués option «design produit» de l ENSAAMA (Olivier de Serres). Ce site sera l interface de mise en vue et de vente par correspondance de ce mobilier et fait partie intégrante du développement du projet. Basés sur le principe du jeu de LEGO et sur les possibilités offertes par les structures d échafaudages, le projet se compose de plusieurs modules types à assembler facilement et permettant d aménager un volume intérieur (ou extérieur) tant dans sa surface au sol que dans sa hauteur. On peut alors construire des structures de mobilier (tables, armoires, chaises ) ou de cloisonnement (mezzanines, cabanes...) en achetant les pièces à l unité, soit pour penser soi même son espace, soit en suivant des plans fournis à l achat. Les structures ainsi créées sont remodulables à l infini et une chaise ou un bureau complété par d autres modules pourra ainsi devenir une armoire ou une mezzanine La particularité du concept concerne la création d un service global incluant la vente par correspondance, les plans de montage et une communauté d échanges de plans, modules ou impressions, ce qui permet une durabilité et une certaine forme d écologie (on ne jette plus, on échange, et on créé du lien social tout en incluant la dimension économique également). Illustration du principe par les deux designers exemple de structure

3 3 Le cœur du site est constitué par une application permettant à l utilisateur d assembler en ligne les modules qu il a choisis et ainsi de construire des objets virtuellement. Cela permet de visualiser différentes possibilités de création et d appréhender au mieux les quantités à commander. 2. PUBLIC CIBLE Pour le moment, le public cible du mobilier semble plutôt concerner des personnes jeunes ou en tous les cas ouvertes et cultivées, prêtes à affirmer l originalité de leur intérieur, à créer des structures eux mêmes et à acheter par correspondance. Les étudiants peuvent également être intéressés par la possibilité d optimisation de leur espace et l achat à l unité, permettant d adapter le budget aux besoins et d aménager des intérieurs souvent petits de la façon la plus adaptée possible. Le public du site internet concerne plusieurs types de profils : - Public intéressé par le projet, pas encore client, qui souhaite commander en ligne, en se référant à des plans prédéfinis ou en testant les possibilités offertes par son choix de modules grâce à la construction en ligne - Public déjà client qui souhaite commander d autres modules ou échanger ses impressions et modèles sur le forum (qui donc possède un login et appartient à la communauté) - Public non client qui souhaite s amuser à utiliser le jeu de construction en ligne A ces trois types de profils peuvent correspondre deux parcours personnalisés, non réalisés sur le site mais tout à fait envisageables. Cela est expliqué dans la partie concernant l architecture générale du site. 3. OBJECTIFS Le site doit en premier lieu formaliser un espace de vente par correspondance (seul mode d achat prévu), agrémenté principalement par une zone de construction en ligne (de type jeu de Lego sur internet), un catalogue de réalisations et un forum. La présentation des designers et du projet ainsi que leur contact et leurs références doivent également apparaître, donnant au projet de site une dimension de visibilité et de promotion. La structure doit être suffisamment simple pour être ludique et intuitive, et ainsi correspondre à tous types de profils d acheteurs. Les images réalistes (rendus 3D ou photographies) doivent permettre d appréhender la réalité des objets présentés et ainsi de les projeter dans son intérieur. Le but étant de vendre uniquement sur Internet (avec en complément possible la mise en place d un showroom réel), il faut que les utilisateurs puissent faire confiance au contenu et avoir un aperçu suffisamment clair de leurs achats. Ces images n ont cependant pas encore produites.

4 4 La dimension communautaire et le jeu de construction doivent donner envie de revenir régulièrement sur le site. Plus particulièrement, le module de construction doit être manipulable par tous les types de publics visés voire tout type de personne. Il a pour objectifs à la fois d attirer l attention des futurs acheteurs par son originalité (la construction en ligne) et également et paradoxalement donner suffisamment d informations pour être compréhensible et permettre la projection («voilà à quoi pourrait ressembler ma chaise avec les modules que j ai choisis») tout en restant assez sobre pour conserver la dimension de surprise et le plaisir de découvrir au montage l aspect réel de son objet. CAHIER DES CHARGES 1. RESSOURCES MEDIAS Les textes Utilisés avec parcimonie, sans aplats et de façon très simple (mise en valeur des informations importantes) - Information (présentation du projet et des designers, caractéristiques du module sélectionné, boutons cliquables, etc ) - Communication (participation au forum) Les images Le site est très illustré et les images sont de plusieurs types : - Plans (catalogue de plans, visualisation de la construction en ligne) - Dessins en perspective (modules à assembler dans le jeu de construction) - Rendus réalistes (catalogue de mobilier réalisé avec les modules, détail des modules) - Photographies (références, échange de réalisations dans le forum) Les images sont avant tout un argument de vente. Les images réalistes restent limitées à l essentiel, afin de garder la découverte une fois montée sa structure chez soi, tout en rassurant quant à l aspect global possible de cette structure.

5 5 Son Aucun son n est envisagé à cause du désagrément éprouvé sur les sites dont on ne trouve pas le bouton d arrêt lorsque l on est déjà en train d écouter de la musique sur son ordinateur. Seules les vidéos permettront d entendre les réponses aux questions les plus fréquentes et seront lancées manuellement par l utilisateur. Vidéo Des vidéos sont intégrées dans la partie relative à la présentation des deux designers (également appelée «contact»). La préparation des questions, le film, le montage, les effets, l intégration au site, sont autant de points qui seront abordés dans la construction du site. 2. STRUCTURE ET NAVIGATION La structure du site est simple, constituée d une page d accueil renvoyant à 4 catégories : - 3 catégories principales, correspondant à différents types de public Public novice, qui se dirige plutôt vers le catalogue Public novice ou averti qui souhaite construire en ligne Public averti qui fait parti de la communauté et se dirige vers le forum - 1 catégorie complémentaire, plus informative Contact et présentation des designers Ces quatre catégories doivent être visibles et accessibles en permanence par les clients, afin de faciliter la navigation, mais des accès plus restreints peuvent être proposés par les utilisateurs non inscrits et/ou non clients. Dans l idéal, une base de données permettrait de proposer des parcours personnalisés pour les utilisateurs membres de la communauté ou les utilisateurs «simples visiteurs». Cette partie n a pas été réalisée, faute de temps mais aussi de possibilité d hébergement, mais elle pourrait cependant être mise en place dans un second temps, par les designers eux mêmes ou des personnes plus compétentes.

6 6 Architecture du site Accès restreint au site

7 7 3. FORMES ET DEGRES D'INTERACTIVITE L interactivité se trouve dans plusieurs des catégories : - Interactivité de navigation, avec cliquage de boutons - Interactivité de manipulation (espace) pour la construction du mobilier en ligne, en assemblant des modules - Interactivité d insertion de données avec le forum, où chacun peut participer et ainsi construire le contenu La partie «contacts» apporte également une interactivité «vécue» avec les deux designers qui semblent répondre aux questions qu on leur pose à travers un média vidéo. 4. CHOIX TECHNIQUES Le site sera réalisé entièrement en Flash, pour plus de cohérence (le jeu de construction, notamment, ne peut être réalisé que sur ce logiciel) et dans le but de manipuler un unique logiciel. Le logiciel Pinnacle a été utilisé pour acquérir et traiter les données de la caméra vidéo de l un des membres du groupe puis les effets et retouches plus approfondis ont été réalisé à partir du logiciel After Effects.

8 8 SCENARIO Le site se décompose en plusieurs parties : I. La séquence d ouverture permet d entrer dans l ambiance et de comprendre progressivement le concept des modules à assembler pour aménager son intérieur. a. La première page, blanche, permet de choisir la langue, française ou anglaise. Cette page permet d afficher la barre de chargement du site. b. Une fois cliqué sur le bouton «Français» (la version actuelle du site ne sera présentée qu en français), une page vide s affiche c. Sur cette page apparaît au fur et à mesure une image d objets du quotidien, dessinés à la main, qui vont venir dessiner une architecture rappelant le concept de modules (cercles à l intersection de lignes). Le croquis rappelle que l objet proposé veut s intégrer dans le quotidien, et qu il a été dessiné, pensé, par l homme et pour l homme. Il ramène une dimension plus humaine à un projet qui peut paraître très fonctionnel et/ou technique. d. Apparaît ensuite une phrase, en superposition avec les images, qui explique de façon poétique le concept des modules. e. Enfin, les boutons de menu apparaissent et deviennent cliquables. II. On peut ensuite basculer sur trois univers possibles a. Le catalogue, pour s imprégner de réalisations possibles, de plans, de matériaux, de quoi stimuler son imagination et trouver son inspiration b. La page de construction, qui ne comporte que très peu de textes (seules les explications relatives aux modules choisis pour la construction s affichent lorsqu on clique dessus). Un bouton permet d accéder à l aide technique pour la construction en ligne, qui contiendra un texte explicatif ou, mieux, une petite animation didactique. c. Le forum, qui sera en réalité un forum externe au site III. Enfin, la page «contact» permet d avoir un contact à la fois virtuel (mail, adresse ) et visuel avec les deux designers à travers une vidéo. a. Un FAQ comprendra plusieurs questions écrites, auxquelles seront apportées des réponses filmées. La liste des questions est la suivante : 1. A l origine, vous êtes deux amis, étudiants en design produits. Comment et pourquoi vous est venue cette idée de développer un nouveau concept d aménagement intérieur? 2. Quelles sont vos qualités respectives? La création à deux, ça passe par le conflit ou la mise en commun? 3. Sur quel concept repose cette nouvelle manière d aménager?

9 9 4. Quels sont les objectifs de la communauté que vous souhaitez créer autour de ce projet? 5. Quelle est votre vision à plus long terme? De nouveaux modes de faire pourraient il généraliser et pérenniser le concept? Les deux personnes filmées le sont séparément, et ne répondent donc pas aux mêmes questions. Ce choix a été fait en collaboration avec eux, tout comme la rédaction des questions puis leur montage ont été faits en commun. Les vidéos détourées sont placées sur le fond blanc du site, sans limite visible, rendant ainsi les personnages partie intégrante du site. L INTERFACE Un certain nombre de critère ont été définis pour le site, en collaboration avec les destinataires du site, pour aboutir à un cahier des charges, suffisamment précis pour correspondre aux attentes et envies des deux designers, suffisamment large pour que nous puissions construire nous mêmes une charte. Voici, en substance, le contenu de ce cahier des charges : Couleurs en nombre restreint Fond blanc ou très clair Mélange entre des traits vectoriels, du dessin et des retouches numériques Simplicité des formes Jeux de superpositions Plusieurs sites internet existants, extraits du livre «Web design index 6», ont servi de support visuel à la communication et ont été des sources, si ce n est d inspiration, du moins de réflexion et de base de communication. Le contenu du site est ENCADRE Superposition de rectangles Fond blanc Couleurs limitées Menu fixe

10 10 Superposition de CALQUES Fond blanc Couleurs neutres Interface simpliste Menu fixe fuer werbefotografie.de SIMPLICITE DU MENU Couleurs limitées Variations sur les typologies de polices Menu fixe design.com Traitement des ELEMENTS DU MENU Simplicité Sobre et fonctionnel site.tk Structuration Rassemblement d IMAGES Pas de couleurs sur l interface Géométrie simple

11 11 STORY BOARD Pages du site Langue Ambiance

12 12 Catalogue Construction

13 13 Communauté Contact

14 14 Charte graphique Typographie La police Tunga, sans empattements et donc plutôt contemporaine tout en restant simple convient ici car les textes à lire ne sont pas longs et leur corps est relativement grand (14 pour les textes et 18 pour les menus). Cette police a cependant dû être modifiée car elle ne se trouve pas sur tous les ordinateurs et aurait obligé l utilisateur à l installer pour pouvoir afficher les textes. La police choisie est donc une Perpetua, de corps grossis de 2 points car cette police est relativement petite. Palette de couleurs Fond Les couleurs sont très douces, pour ne pas prendre le pas sur le contenu et rester en adéquation avec la volonté de simplicité et de pureté. Dans les tons vert d eau et gris, ils permettent de créer une ambiance plutôt neutre pour un projet qui se veut adaptable à tous les intérieurs. Le fond est de couleur blanche, encadré par une ligne rappelant le concept des modules (lignes droites pour les tubes, décrochés arrondis pour les liaisons) qui permet à la fois d apporter une cohérence à l ensemble du site et de mettre en scène les différentes pages. Le menu est également une constante d une page à l autre et permet, audelà de son rôle de point de repère, de revenir aux pages souhaitées à tout instant. Le cadre se prolonge pour encadrer le titre de la page en consultation, ce décrochement permettant d intégrer de façon très simple le repère de navigation tout en utilisant la totalité de la page. Choix graphiques Les choix graphiques sont en accord avec la simplicité de la charte graphique. Très peu illustratifs, les graphismes expriment une simplicité, une transparence, qui se veut intemporelle et correspond néanmoins aux codes actuels. Les images sont peu nombreuses et correspondent toujours à ce choix d épurer le site et de le rendre très clair : Pour le catalogue : ce sont des dessins d intégration des objets sur photographie, des photographies presque abstraites (car en gros plan) de matériaux ou encore des rendus des modules.

15 15 Le jeu de construction utilise des pièces en filaire, qui ne sont que peu réalistes et permettent de détacher la construction de la réalité en entretenant ainsi la curiosité et la découverte. Les zones de couleur se superposent, en mouvement ou nom, pour afficher simultanément plusieurs informations. Leur zone de rencontre peut souligner un élément important, par exemple la pièce choisie pour le jeu de construction. CONCLUSION SUR LE PROJET Ce projet a été enrichissant de plusieurs points de vue : Nous avons travaillé pour des porteurs de projet réels, qui nous ont laissé une grande liberté dans notre réflexion sur le site internet qui pourrait correspondre à leur demande mais nous ont également guidés dans nos choix, présents à chacune des phases de validation et proposant les éléments qui ont servi à nous inspirer et à trouver un accord commun. D autre part, le fait de travailler sur un projet qui n est, pour le moment, pas finalisé, ni techniquement, ni commercialement, nous a permis de faire avancer le concept de mobilier modulable, non pas en terme de création mais en terme de structuration de la pensée, de premiers choix fondateurs, d orientations graphiques Nous avons, par exemple, mis le doigt à plusieurs reprises sur des détails qui, soit ne fonctionnaient pas, soit avaient besoin d être précisés ou simplifiés. Cela s est révélé être valorisant et nous a apporté une certaine crédibilité vis à vis du projet, nous faisant passer du statut de simple exécutants à celui de codéveloppeurs du site. Ce site internet n est, bien entendu, que la préfiguration d un site futur, plus complet peutêtre, plus opérationnel commercialement surement (avec la possibilité de paiement en ligne, d éditer ses factures, de parcours personnalisés et de gestion de base de données, d achat dans une nouvelle rubrique, sans être obligé de passer par le jeu de construction ) Il permettra d une part d ouvrir des pistes de réalisation aux deux designers, de leur donner une première base de codes et d animations, et d autre part d avoir des éléments tangibles à présenter à leurs possibles aides à la création, que tout élément de mise en forme du projet peut intéresser et également rendre la demande plus crédible. Former un groupe de quatre personnes d horizons et aspirations différentes, sur un projet pour lequel seul l un des membres est personnellement impliqué aurait pu poser problème dans le projet et sa gestion. Cependant, les tâches se sont réparties assez naturellement, chacun trouvant sa place et participant à mesure de ses compétences. Un projet formateur donc, humainement, socialement, professionnellement, techniquement. Une première approche de la création de site Internet, avec pour certains une approche plus techniques et pour d autres une approche plus méthodologique, avec un grand soin apporté à la construction de la pensée et de l architecture.