Afin que je puisse soumettre à Mohammed des maquettes cohérentes et conçues en respect de ses attentes, de ses besoins et de ses impératifs, j’ai organisé en amont du démarrage de ma mission, une réunion de cadrage avec Mohammed afin que ce dernier puisse me communiquer précisément ses contraintes techniques et me transmettre toutes les instructions nécessaires. Pour développer les sites-commerce de ses clients, l’équipe de développement de SynergyWeb utilise le CMS WordPress et l’extension WooCommerce. Il était donc primordial que je puisse réaliser le site de démo Hiasan en identifiant toutes les possibilités offertes par ce plugin mais également les contraintes techniques qu’il induit.

Afin que le site de démo puisse parler au plus grand nombre, Mohammed m’a proposé d’imaginer un site fictif qui commercialise des produits d’ameublement et de décoration. Pour désigner le projet, j’ai proposé de le nommer « Hiasan » qui signifie en malaisien « Décoration ».

Pour la V1, nous avions convenu de réaliser une page d’accueil, une page d’atterrissage produit avec des filtres et une page de présentation d’un produit type. Dans un premier temps, j’ai effectué un recensement de toutes les fonctionnalités et des types de contenus qu’un utilisateur était susceptible de retrouver dans ces pages. Par la suite, j’ai réalisé un wireframe pour organiser l’ordre des fonctionnalités et des différents contenus graphiques et textuels que je souhaitais mettre en avant au sein de mes interfaces. Enfin, en vue du design des interfaces, j’ai élaboré une charte graphique pour définir l’orientation artistique de Hiasan. Afin de conférer à mes maquettes un aspect moderne et un style qui s’inscrive dans l’ère du temps, j’ai opté pour des teintes dominantes de blanc, de bleu pétrole et d’orange puis j’ai sélectionné des photos de produits et d’ambiance cohérentes vis-à-vis de ma charte pour pouvoir illustrer par la suite mes maquettes.