créer une police icones avec icomoon
DESCRIPTION
Oubliez les images aux multiples résolutions et passez aux polices d'icônes ! Création via IcoMoon d'une police d'icônes et utilisation de celle-ci dans des applications mobiles iOS / Android. Présentation lors du Meetup Montpellier Mobile du 20 mai 2014.TRANSCRIPT
![Page 1: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/1.jpg)
Montpellier
Mobile
@timoa#MtpMobile
CRÉER UNE POLICE D’ICÔNESOubliez les images aux multiples résolutions
et passez aux polices d'icônes !
![Page 2: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/2.jpg)
Montpellier
Mobile
@timoa#MtpMobile
C’EST QUOI LE PROBLÈME ?
Lors du développement d’une application mobile, on doit prévoir pour une seule image, au minimum
4 résolutions pour Android et 2 pour iOS…
Pour une simple icône monochrome, ça fait beaucoup de temps perdu et cela alourdit
votre application mobile.
![Page 3: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/3.jpg)
Montpellier
Mobile
@timoa#MtpMobile
LA SOLUTION ?Faire une police de caractères incluant vos icônes !
Ainsi vous aurez les avantages suivants :
• Icônes vectorielles donc pas de perte de qualité • Icônes disponibles dans toutes les tailles • Changement possible de la couleur des icônes • Taille du fichier (~10Ko) • Fonctionne sur tout les OS mobile !
![Page 4: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/4.jpg)
Montpellier
Mobile
@timoa#MtpMobile
COMMENT FAIRE ?
Nous allons créer notre police de caractères avec le service gratuit IcoMoon.
Cette application Web permet de : • Gérer ses différents projets / polices • Disposer de librairies d’icônes comme Entypo • Ajouter ses propres fichiers SVG
![Page 5: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/5.jpg)
Montpellier
Mobile
@timoa#MtpMobile
LA DÉMO !Article sur TiDev.io
![Page 6: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/6.jpg)
Montpellier
Mobile
@timoa#MtpMobile
QUESTIONS ?
![Page 7: Créer une police icones avec IcoMoon](https://reader033.vdocuments.site/reader033/viewer/2022050922/5598ec2f1a28ab74118b4613/html5/thumbnails/7.jpg)
Montpellier
Mobile
@timoa#MtpMobile
RESSOURCES
13 300 captures d’interfaces mobile & tablette, icons, fonts, PSDs, etc http://pinterest.com/timoa