Començaré dient una cosa que potser molts sàpiguen ... però no importa: HTML5 + CSS3 + JS ... simplement perfecte 🙂
Un usuari em va escriure un correu electrònic preguntant-me sobre algun tutorial per a ell poder crear icones flat, aquests que són plans i que és la nova moda a la web. Específicament volia mitjançant Inkscape o Gimp un botó estil xat o alguna cosa que li servís (o fes referència) a Snapchat.
Com jo sóc pèssim amb Inkscape ia més, creant contingut des de zero inclusivament amb Gimp empesto ... doncs vaig recordar que fa un temps vaig veure una petita aplicació web (XNUMX index.html amb alguns css i js) Que ens permetia crear de forma simple i ràpida icones plànols a la moda actual, ja saben, els dissenys Flat.
Flat Icon Generator
Té una sèrie de icones predefinits, per exemple icona de Laptop, dispositius mòbils (el que mostro al screenshot), regal, bicicleta ... uff, són bastants, realment una gran varietat:
Però no és qüestió de només posar la icona i ja ... podem mitjançant dues barres horitzontals definir la mida de la icona o la mida de la imatge com a tal (icona + background). Òbviament ens apareix la mida quadrat en píxels ... 256 ... 512 ... etc
La següent opció ens permet triar el color de l'background així com també, el de la icona. Per defecte la icona és blanc i el background blau, perquè no desentoni molt.
Finalment en aquesta barra a l'esquerra d'opcions, ens permet definir si les vores de la icona són quadrats o si per altra banda, volem que sigui circular el resultat final.
Els deixo un screenshot d'aquestes opcions:
D'altra banda, a la part superior ens mostra la informació de la icona que s'està generant i canviant en temps real. O sigui, si juguen una mica amb les mides i colors veuran que aquesta informació canvia sempre en temps real:
Com poden veure, també comptem amb un botó Get Icon, El qual ens mostraria la icona ja generat en PNG en una altra pestanya, en la qual podem donar Clic dret + Desa i llest, tindrem la icona flat que generem a la carpeta desitjada del nostre ordinador.
Descarregar Flat Icon Generator
Si desitgen provar vosaltres mateixos (que imagino així sigui jaja), aquí els deixo el link:
Amb això espere complir amb el que l'usuari em va preguntar per email, si bé no és un tutorial per crear el botó amb Gimp o Inkscape, bé, això igual imagino que li serveixi per al que vol. De fet, no pot només generar el botó per el link de descarregar snapchat, Sinó que fins i tot podria generar la immensa majoria de les icones o botons per al seu lloc, o el que sigui que estigui fent 😀
Salutacions i espero els hagi resultat interessant.
No entesa com s'usa 🙁 Només es poden fer les opcions d'icones que dóna?
Està molt bo, m'apunto el link.
Jo sòl utilitzar IcoMoon App (https://icomoon.io/app/#/select) Que també és força interessant i molt complet; encara que no sé si és exactament el mateix al que referència el post.
Salutacions.
Em va agradar la idea de personalitzar icones, em van agradar els links (el teu i el de l'user Percaff_TI99). Els guardaré en els meus favorits 😀
Interessants propostes, tot i que ja prefereixo fer servir Inkscape pel fàcil de fer les icones plans (de fet, és més pràctic que un altre editor vectorial que he fet servir, tot i que encara no m'acostumo a fer gràfics vectorials més avançats amb aquesta aplicació).
Molt pràctic i fàcil d'utilitzar. També podria cobrir aquestes necesiades usant Font Awesome: http://fortawesome.github.io/Font-Awesome/
Gràcies per compartir! això 🙂
Vaja que interessant d'assegurança servira per a molts projectes. Em preguntava com és una aplicació web es podrà portar per firefox us? En creant un webapp una drecera directa o similar per fer-la servir? Disculpin nose per això pregunto.
Ara que estem en Nadal molts pares regalaran als seus fills un smarthfone per reis. ¿Qués és una de les primeres coses que faran amb aquests dispositius? Sense cap dubte una d'elles per no dir la primera serà descarregar snapchat i una altra d'elles serà la descragra de WhatsApp. A l'tractar-se d'aplicacions gratuïtes, la majoria dels adolescents disposen d'aquestes en els seus mòbils.
Crec que una de les causes de l'èxit d'aplicacions de l'tipus de snapchat és en primer lloc que són gratis, per altra banda s'ha creat la moda d'enviar imatges gairebé de cada cosa que es fa al llarg del dia i finalment perquè es tracta d'una app molt fàcil d'utilitzar
Excel·lent! Aquest web m'ha servit bastant en el procés de creació de l'logotip per al meu nou web de snapchat, coincidentment amb l'usuari que et va fer la consulta. Els envio una abraçada des de Paraguai, molt bo el lloc 😉 Salutacions.