Sketch app : Tous les raccourcis clavier

Si vous êtes un utilisateur de Sketch, cette nouvelle ressource devrait très certainement vous plaire. Quelque soit le logiciel de création graphique avec lequel vous travaillez, les raccourcis clavier nous aide à gagner du temps pendant nos longues journées de travail, entre deux cafés.

Meng To, vous vous met à disposition l’ensemble de ces raccourcis sur son site design+code.
En plus de la possibilité de télécharger le fichier du clavier au format .sketch, il vous met à disposition tout un ensemble de démo rapide, au top !

Voir les raccourcis pour sketch

 

Un UI Kit Material Design à télécharger (.psd .sketch .XD)

Si vous concevez des interfaces mobiles pour application Android, que ce soit avec Photoshop, Sketch ou encore Adobe XD, cette ressource devrait vous intéresser.

En effet, Emma Drews à conçu cet UI Kit, disponible en format PSD, Sketch et XD. De quoi satisfaire tout le monde !

Pour télécharger cet UI Kit, rendez-vous sur le dribbble d’Emma.

PS Guides : Le plugin de grille pour Sketch

Sketch a largement su se démarquer comme se démarquer dans le design d’interface. Il n’est d’ailleurs plus besoin de le présenter dans le milieu de l’UX et de l’UI Design, mais il faut avouer que le système de grille n’est pas ce qui est de mieux.

Avec ce nouveau plugin, c’est maintenant corrigé. Appelé PS Guides, il vous permettra de générer une grille très simplement, idéal notamment si vous utilisez bootstrap ou tout autre framework CSS pour le développement.

L’utilisation du plugin PS Guides :

Ce serait difficile de faire plus simple. Il vous suffit d’indiquer le nombre de colonnes, l’espace en pixel entre chacune d’entre elles, et l’espace à droite et à gauche de la grille et… BOOM votre grille est en place !

Paramétrage de la grille avec PS Guides

Télécharger le plugin PS Guides pour Sketch

Adobe XD : Un UI Kit gratuit à télécharger

Le petit nouveau d’Adobe, baptisé Adobe XD commence à devenir de plus en plus populaire, bien que le logiciel soit toujours en version beta à l’heure actuelle, et que la version windows soit légèrement en retard sur la version de mac.

Si vous ne connaissez pas ce nouvel outil, et que vous êtes designer d’interface, je vous invite à aller le découvrir au plus vite !

Vu que l’on commence à entendre de plus en plus parler de cet outil, il est donc logique que des ressources commencent à pointer le bout de leur nez. Découvrez ici tout un kit de composant, à télécharger gratuitement.

La dépêhe de l’UI Design – 28 février 2017

UI/UX Design

UX of Authentication on Mobile
Découvrez les bonnes pratiques sur les formulaires d’identification sur mobile

Focus floating button
Un article pertinent (et en français) sur l’utilsiation des floating buttons, proposé par UX Republic

3 conseils d’ergonomie pour la conception d’applications de gestion
Un article d’Usabilis (FR) à lire. Simple mais pertinent

3 Key Uses for Animation in Mobile UI Design
Un article très intéressant paru sur Medium traitant sur les principales animations à utiliser dans vos applications mobiles

 

Les meilleurs portfolio de février 2017
Une sélection de superbes portfolio proposée par WebdesignDepot

HTML/CSS

CSS avancé : métriques des fontes, line-height et vertical-align
Un article très complet (en français!) sur le réglage du line-height pour vos typos

55 CSS Checkboxes
Une liste de 55 checkbox custom, avec les démo et les sources à télécharger

Squeezy Stretchy Flexbox Nav
Si vous êtes adepte de flexbox, allez découvrir cette technique sur la navigation proposée par css-tricks

Image Mask Effect
Un tutorial signé codyhouse sur l’utilisation des mask en CSS

Ressources

150 SVG, PNG, AI, EPS Color & Line Icons

Dashboard UI Kit

Edd – Landing Page (.sketch)
Un template pour vos landing page, à télécharger sur Dribbble

Typographie

Krabuler

 

Flowchart pour Sketch : améliorer l’UX dans vos design

Lorsque l’on travail sur une application ou site web relative important en terme d’écran, on peut vite s’y perdre.
De même, lorsqu’un développeur récupère l’interface que vous avez conçu, il se peut qu’il ai du mal à s’y retrouver.

En effet, une UX réussie passe aussi par une bonne organisation de l’information. Grâce à cette nouvelle ressource pour SketchApp, vous pourrez concevoir une interface intuitive et organisée, comme le montre les captures ci-dessous.

Avec ce template, vous aurez toute la panoplie nécessaire à créer un organigramme pour votre design

 

 

UI Selection inspiration #5

Découvrez une nouvelle sélection des plus belles interfaces et animations UI publiée sur le web. Comme d’habitude on y retrouve aussi bien du web que du mobile.

Travel app, par Stano Bagin

Direct Messaging – Chatbox, par jokinL

Setmore – Modal windows, par Lukáš Straňák

tvOS, par Neeson

Engagement Dashboard – Sessions, par Adrian Madács

Digitland Navigation, par Stoyan Daskaloff

Landing – Saving Money, par Jeremy Jones

Smart MZD Player

Log In for a Job App, par Bertil Boisen

gabeloot, par patrickreza

Dashboard [TV], par Michal Soukup

Wine Product List, par michael henning

Digitaland Enter Animation, par Stoyan Daskaloff

Bézier Game : le jeux qui vous fera devenir un expert de la plume

Voici un jeux original et très utile pour ceux qui ont du mal à se servir de l’outil plume sur l’ensemble des outils de graphisme.
Il s’appel tout simplement The Bézier Game, il vous suffit de retracer l’image à l’écran, afin de passer d’étape en étape. Simple mais génial !

personnellement, j’adore 🙂