Tous les articles dans Freebies

Téléchargement de l’illustration “Content is like Water”

Cette illustration est basée sur la citation de Josh Clark (inspirée de Bruce Lee) à BDconf “The Seven Deadly Myths of Mobile” : You put water into a cup it becomes the cup. You put water into a bottle it becomes the bottle. You put it in a teapot, it becomes the teapot. Elle explique le fonctionnement d’un site responsive dont le contenu s’adapter à n’importe quel type d’appareil. Elle est également utilisée sur Wikipedia pour illustrer l’article sur le responsive. …Lire la suite

Photoshop Style Guide .PSD (et workflow)

[Freebie] Photoshop Style Guide

Voici le fichier Photoshop de mon style de guide de projets web. Vous avez été plusieurs à me demander ce que j’y met, je me suis dit que je pourrais tout aussi bien vous partager le fichier .PSD. I contient des instructions de couleur, de typographie responsive, des boutons et éléments de formulaire dans les états normal, active, survol, des tableaux, alignements d’images, etc.Lire la suite

[Freebies] Illustration Stratégie Responsive vs Mobile First Responsive

[Freebies] Illustration Stratégie Responsive vs Mobile First Responsive

Ce contenu a été rédigé il y a 2 années. Il se peut qu’il ne soit plus à jours.Le mot ” Responsive ” veut aujourd’hui dire beaucoup de choses. Dans son article Responsive Strategy, Brad Frost nous explique la différence entre un site qu’il appelle ” Responsive Retrofitting ” et un site ” Mobile First Responsive Design “. Dans le premier cas, il s’agit de prendre un site conçu dans sa structure, son code et son ergonomie pour des grands appareils …Lire la suite

[Freebies] Template de zones cliquables au touch (mobile, tablette, hybride)

[Freebies] Template de zones cliquables au touch (mobile, tablette, hybride)

Ce contenu a été rédigé il y a 4 années. Il se peut qu’il ne soit plus à jours.Pour ma présentation et les cours à l’université j’avais besoin de montrer différentes utilisation de mobile, tablette et appareils hybrids au touch. J’ai donc créé ce petit pack de templates. Les données utiliser pour dessiner les différentes zones se basent sur les lectures suivantes : Responsive Navigation: Optimizing for Touch Across Devices par Luke Wroblewski How Do Users Really Hold Mobile Devices? Le …Lire la suite

[MAJ] Template Photoshop et Illustrator d’appareil mobile et desktop

Template .PSD et .AI d’appareil mobile et desktop

Ce contenu a été rédigé il y a 4 années. Il se peut qu’il ne soit plus à jours.Pour des besoins de présentation de travaux et différentes slides de conférence et cours, j’ai mis à jour mon Template .PSD d’appareil mobile et desktop La nouvelle version propose en plus des ressources d’appareil mobile, tablette et écran d’ordinateur au format de formes .PSD les améliorations suivantes: une icône d’ordinateur portable (laptop) une version des appareils iOS au format vectoriel disponible en .EPS …Lire la suite

Illustration “Le responsive n’est que le sommet de l’iceberg”

Ce contenu a été rédigé il y a 5 années. Il se peut qu’il ne soit plus à jours.J’utilise cette métaphore pour faire comprendre en cours et conférences que le responsive web design n’est au final qu’une infime partie d’une stratégie mobile globale qui va inclure d’autres technologies, techniques et acteurs du web. La métaphore de l’iceberg est inspirée de Brad Frost.   L’illustration et la traduction de l’article sont sous licence Creativ Commons Attribution – Partage dans les Mêmes Conditions 3.0 France …Lire la suite

Traduction “Responsive Webdesign – présent et futur de l’adaptation mobile”

Illustration “Content is like Water” et traduction “Responsive Webdesign – présent et futur de l’adaptation mobile”

Ce contenu a été rédigé il y a 5 années. Il se peut qu’il ne soit plus à jours.La traduction Vous avez été nombreux à très rapidement me demander par mail et twitter une traduction de “The State Of Responsive Web Design“. Après de longues heures de traduction et surtout une grosse relecture de mes collègues, la traduction est disponible en ligne sur alsacréations : Responsive Webdesign – présent et futur de l’adaptation mobile Nous avons essayé de rajouter des …Lire la suite

Template .PSD d’appareil mobile et desktop

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.

Ce contenu a été rédigé il y a 5 années. Il se peut qu’il ne soit plus à jours.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 …Lire la suite

Pack de 30 icones sociales pour webdesigners et développeurs

Ce contenu a été rédigé il y a 6 années. Il se peut qu’il ne soit plus à jours.J’ai publié ce matin sur Onextrapixel le pack complet d’icônes social, une grosse mise à jour de ce pack. Il comporte désormais 30 icônes de réseaux sociaux dans trois tailles (39x40px, 58x60px et 77×79). Ces réseaux sociaux sont à la fois ceux que j’utilise en tant que webdesigner/developpeur, mais aussi ceux qu’on m’avait demandé en plus sur G+.   Vous pouvez voir l’article …Lire la suite

Android script Photoshop pour exporter en ldpi, hdpi et xhdpi.

Ce contenu a été rédigé il y a 6 années. Il se peut qu’il ne soit plus à jours.[UPDATE] Ces actions sont dépassées, j’ai fais une mise à jouer disponible sur l’article Android Photoshop actions to export to mdpi hdpi xhdpi xxhdpi and xxxhdpi En général quand je crée une application, je pars du mdpi, du coup, pour suivre les guidelines android, il faut re-créer tous les drawables en ldpi, hdpi et xhdpi. C’est assez long et fastidieux.  Il existe des …Lire la suite