0

DuBeauJ.eu

actu making of réalisation
du-beau-jeu-screenshot

Je publie mon humble collection d’artworks et screenshots de jeux vidéo et elle s’appelle dubeauj.eu.

Pourquoi ?

Je voulais un endroit pour stocker de belles images alors j’ai essayé Pinterest mais rien que l’obligation de préciser une description à chaque image m’a vite gavé. Je voulais aussi pouvoir ajouter une image juste en renseignant son URL pour piller efficacement l’Internet. J’ai donc développé mon propre thème WordPress. A noter qu’aucune image n’a été utilisé dans ce thème. Pure CSS, frak yeah ! Le thème est simple mais ne me satisfait pas totalement pour l’instant, j’y reviendrai de façon itérative.

J’ai pu tester ma méthodologie de déploiement sur mon nouveau serveur Kimsufi, le bien nommé piouf. Un petit « deploy dubeaujeu » dans le terminal et le depôt git sur la prod pull la dernière version depuis github.

Web app ?

Même si j’ai du mal à qualifier dubeauj.eu d’application, j’en ai profité pour tester les possibilités qu’offrent les systèmes d’exploitations mobiles aux web apps. Étonnamment, iOS est bien plus accueillant qu’Android. Une fois le favori web ajouté au menu d’accueil, difficile de différencier une application native d’une web app sur iPhone : c’est le même système pour l’icône et on peut enlever à loisir la barre d’adresse pour afficher la web app en plein écran. Le futur Firefox OS va encore plus loin en accueillant les web apps dans son Firefox marketplace, pour cela, il ne suffit que d’une icône et d’un fichier xml : le manifest.webapp. Finalement, Android déçoit et freine totalement le développement des web apps. Il faut deux étapes pour ajouter une web app sur l’écran d’accueil et impossible de se défaire de l’icône immonde de favori.

dubeauj.eu

du beau jeu screenshot 553x700 DuBeauJ.eu

4

GG – projet d’une web app

making of réalisation site web
10_pres_mobile_first

Demande : « Appli Web » de bons plans avec un design responsive, adapté aux supports mobiles.
Durée : 5 jours
Effectif : 2
Rendus : Présentation, maquettes, site web fonctionnel

team 600x450 GG   projet dune web app

Avec mon collègue @JeanBaptisteSo, nous avons monté l’équipe Junior. Lui, au développement PHP et moi, chargé de la conception graphique et de l’intégration. Passant plus de temps à tester les animations et les mediaqueries CSS qu’à réaliser des mock-up, en faux wedesigner que je suis.

gg 600x450 GG   projet dune web app

GG

Je vous recommande de regarder la présentation, ce ne sera pas long, pour faire un tour du projet :

Présentation GG

Nous avons donc rendu un site web fonctionnel, amputé de nombreuses fonctionnalités évidemment, mais qui permet d’ajouter des bons plans, de s’inscrire, de commenter.
La web app en ligne, n’oubliez pas de redimensionner votre navigateur pour tester en version mobile :

gg.remybarthez.com

responsive 600x450 GG   projet dune web app

Quelques enseignements du projet

- La création des logos (Junior et GG) me plaît toujours mais je n’ai pas encore trouvé ma méthode idéale pour la conception des maquettes du site. Je trouve que le design dans le navigateur m’entraîne vers un graphisme trop vide et strict.
- Le design du site en version tablette nous a paru avoir le cul entre le téléphone et le bureau. Difficile de voir la tablette en paysage autrement que comme un petit écran d’ordi et pareil pour le mode portrait comme un gros mobile. Est-il vraiment nécessaire de penser à une mise en page pour les tablettes ? Je pense que pour certains projets bien spécifiques, cela peut-être intéressant mais pour le reste du temps les design mobiles et ordi s’adaptent bien à cette appareil hybride.