Pour des besoins d’une présentation de travaux responsive, j’ai créé des templates très minimalistes d’appareils mobiles, et d’un écran de bureau : Galaxy Nexus et Nexus 10 pour Android, iPhone et iPad pour iOS. Il s’agit un fichier .PSD, chaque appareil est composé de calque de formes vectorielles pour pouvoir changer facilement la taille sans perte. Vous pouvez téléchager le fichier Photoshop ici : (L’utilisation de cette template est sous licence CC BY 2.0, vous pouvez l’utiliser à des fins … Lire la suite
Workflow de design d’application iPhone avec DevRocket
Mon dernier article publié sur Onextrapixel est un tutoriel détaillé sur le Workflow derrière le design de l’application iPhone “Learn Around”. J’y détaille le design de la vue principale de A à Z, de la navigation et effets sur Photoshop à l’extraction, découpe des images et la préparation pour retina pour les envoyer directement au développeur ensuite. Le design a été réalisé sur Photoshop avec l’aide du plugin DevRocket, plugin qui m’a fait gagner pas mal de temps sur plusieurs … Lire la suite
Des pixels et du code #27
Une petite semaine avec beaucoup de liens orientés code : CSS, CSS3 et responsive webdesign, du retina display, et quelques articles sur le débat de la semaine, le skeuomorphisme Les tutoriels de la semaine #CSS CSS target for off screen designs, ou comment re-créer l’interface de l’envoie de sms iOS en CSS uniquement en utilisant :target #SVG Utiliser un logo cliquable SVG sur un site avec fallback, mon article sur Noupe avec 6 techniques pour utiliser une image SVG en … Lire la suite
Des pixels et du code #18
Cette semaine beaucoup de ressources concernant le Responsive Webdesign, des ressources pour générer du bruit, les nouveautés iOS6 en terme de design ainsi qu’un framework pour créer des applications HTML5 JavaScript contrôlables avec les gestes Kinect. Sans oublier la sortie de github pour Android ! Les tutoriels de la semaine #Canvas Html5 canvas slideshow jquery un tutoriel interessant pour créer un slider en utilisant des canvas pour modifier les images et du jQuery #CSS Set text on a circle Afficher du texte sous forme d’arc … Lire la suite