Les imatges SVG van poblant la xarxa de xarxes perquè en qüestió d'anys, puguem gaudir d'una millor experiència web en termes generals. I és que aquest tipus d'imatges, a part de poder ser ampliades sense perdre res de qualitat en la definició, solen ser de gairebé kilobytes de dades.
SVG és un format de imatge vectorial basat en un XML per a gràfics 2D. Aquest tipus de format gràfic pot ser usat per a tot tipus d'efectes, imatges, animació i interactivitat per donar una major usabilitat en les webs en què s'integra. A l'pesar poc, permet jugar amb aquest tipus d'accions, així que anem a mostrar les millors webs que tenen gràfics SVG per a servir com a inspiració o com un clar exemple de com confeccionar la propera que anem a realitzar per a un client o un treball.
Walking Men Agency
Una agència digital de disseny que es fa valer amb una web ben cridanera per l'ús d'imatges SVG i per un toc molt especial en el visual. Una de la qual inspirar-sense cap dubte. Crida l'atenció el punter transformat en un punt en vermell que es va adaptant a cada un dels elements que conformen la web.
popular Pays
Un web amb un exquisit disseny en la qual destaquen els hashtags que apareixen com «pop ups» i que en cap moment alenteixen la visió i experiència que ofereix aquest lloc. Uns hashtags que són «menjats» per les pròpies imatges que poden ser passades a l'frontal.
Adriaansen
Amb el principal motiu que és el vídeo, és curiosa la forma de fusionar les imatges PNG amb el text que va mostrant-se segons anem fent scrolling cap avall.
10 × 17
Un web per inspirar-per la seva gran idea amb unes animacions que es mouen molt suaument segons anem avançant pel seu contingut. És significatiu el gran avanç en el disseny web a què ens enfrontem a dia d'avui, i és 10 × 17, amb la intenció de mostrar a 26 artistes que conformen els seus àlbums de música favorits de 2017, la qual ho mostra.
Duotix
Simplement prem sobre la icona de tres ratlles horitzontals a la part superior dreta per descobrir les subtils i suaus animacions que mostren el menú de capçalera d'aquesta web. El màxim exemple de com s'han de confirmar unes animacions en un lloc.
Copper & Brave
Una botiga en línia sense molts ostentacions en les animacions, però que serveix com un altre exemple de l'tracte d'imatges SVG.
Rocka
Des d'Espanya tenim a Rocka per mostrar la gran transició de colors que es realitza quan anem explorant el contingut d'aquest web amb la roda de l'ratolí. Una bella experiència amb tot tipus d'animacions.
Paradiso
Un disseny web en el qual es busca la simplicitat dels seus elements per a una gran usabilitat en tot el seu conjunt, sense que falti gens d'enginy en algunes de les animacions que es van mostrant en aquesta gran experiència web que ofereix Paradiso. Tornem a recalcar el que és un menú de capçalera de gran creativitat i acabat en l'animació.
zero
Un estudi creatiu establert a Nova York que mostra totes les intencions amb un menú de capçalera lateral que s'obre davant nostre amb una sèrie d'animacions i imatges ben vistoses. Si busques un menú únic per al teu lloc web, ja pots inspirar-te en el de Zero. Segons vagis movent el punter de l'ratolí sobre cadascuna de les seves opcions, apareixeran aquestes imatges i animacions vistoses.
The Architect Paris
Curiosa la seva pantalla de càrrega i aquesta gràcil forma de mostrar els últims tuits, posts a Facebook o imatges a Instagram. Un lloc web que dignifica l'experimentació web.
Project Redspace
Un projecte amb la idea de commutar els temps en megaciutats xineses i que exerceix gran habilitat en mostrar això mateix gràcies a les seves fosos i degradats amb intel·ligència en l'ús de l'esquema de colors. Àmplies imatges que apareixen i desapareixen amb unes animacions de gran qualitat i manufactura. Dóna enveja.
Tabo Tabo Films
Una productora de sèries de televisió i pel·lícules francesa que mostra un gran poder al vídeo a l'canviar instantàniament a el deixar premut el punter de l'ratolí en cadascuna de les categories. Obre cadascuna d'elles per trobar el que és experimentar amb el disseny web.
James Gillen
Aquest web es val de dos colors principals per crear el contrast just per identificar-se per si mateixa. També destaca per aquesta animació de el fons que està en tot moment en moviment.
Fergie
Zen Studio ens porta aquesta web d'una artista reconeguda a tot el món i que és l'exemple màxim del que pot ser una web: un vídeo clip interactiu en què el nostre punter és el que governa l'animació exclusiva. Imprescindible.
exorcista
Una consultora establerta a Brasil que fa servir les animacions com cortines per mostrar cadascun dels seus serveis. Simple, però efectiva en l'ús dels colors verd i blau per a un fons en blanc.
Diewel
Una altra experiència visual basada en el groc i el negre, I que té gran efecte per anar mostrant les catàstrofes.
Olivier Guilleux
Portfolio frontend que mostra una sèrie d'habilitats web que no deixa a ningú indiferent.
la Clairière
Espai de coworking amb un objectiu posat en el color verd. Més animacions cridaneres per a una tipografia evident que pren gran protagonisme gràcies a l'ús d'aquest moviment suau i precís. Recomanable l'exploració de la icona de menú.
Insurance experiments
un web amena i desenfadada que no busca molt més del que s'ha dit.
The State of European Tech
Si vols un web amb menús laterals que es distingeixi de la resta, fixa't bé en aquesta on experimenten amb una gran forma d'entendre aquests espais, els seus sentits i les seves animacions.
Kappow
Edredons Buffy
Alpso Mleko
Una marca famosa eslovaca de llet que es val de l'exploració a través de l'scrolling per mostrar una digna i cridanera experiència web. Curiosa a el menys.
Pacificandc
Herokid Studio, un espanyol, ens porta el disseny d'aquesta web que destaca pel negre, el groc i una sèrie de vídeos que mostren gran elegància en l'experiència que propina.
En l'estudi buque21.com apostem pel SVG com la millor opció des de fa temps. Ens encanta! i als clients també.
La publicitat de Ovisoft és invasiva i no permet veure aquest article de forma correcta. Llàstima, és un bon article amb bona informació.
Pots obrir-les des dels enllaços i experimentarlas per tu mateix: =)