Arxiu de la categoria "Eines i recursos "

  • Dilluns 25 agost 2014 per

    Smarty Pins, quan Google Maps és el tauler de joc

    Smarty Pins, un trivial basat en Google MapsSi sou d’aquells que aprofiteu l’estiu per a descobrir nous jocs, la gent de Google ha preparat un trivial amb preguntes i respostes que utilitza Google Maps com a base. El joc es diu Smarty Pins i aneu alerta que és addictiu!

    Es tracta d’utilitzar els mapes de Google per a respondre preguntes relacionades amb un lloc determinat del planeta. Per a guanyar punts s’ha de col·locar un “pin” on es considera que s’ubica la resposta. Les preguntes – que només estan disponibles en anglès – es divideixen en categories com art i cultura, ciència i geografia, esports, història o entreteniment.

    Podria semblar un joc senzill, però per a jugar-hi només disposem d’una milla (1609 Km) per partida – que vindrien a ser els punts – i que anem perdent a mesura que ens allunyem de les respostes correctes. Quan s’acaben els quilòmetres, s’acaba la partida. Per sort també podem guanyar quilometratge si posicionem ràpidament la resposta correcta.

    Altres jocs que utilitzen Google Maps o Google Street View

    I, si no en teniu prou, aquí us deixem amb altres jocs basats també en Google Maps i Google Street View. Esperem que us agradin!

    • GeoGuessr
      És un joc que utilitza Google Street View. Ens deixa a una localització aleatòria i hem d’intentar esbrinar on som.
    • Persued
      És un joc similar a l’anterior però amb una història de fons. Representa que ens han segrestat i hem d’aconseguir fugir. No sabem on som, però tenim 5 minuts per esbrinar-ho. Si ho encertem, podem anar passant de nivell.
    • Cube
      Un experiment per a Google Chrome, en què jugues amb un Google Maps en forma de cub i et desplaces a ciutats com Tokio, Roma o Nova York. Amb el cursor has de portar la bola al marcador que hi ha al mapa. Proveu-ho només si teniu una bona connexió a Internet!
    • Street View Zombie Apocalypse
      Aquí pots introduir una adreça i, a partir de Google Street View i Google maps, intentar escapar-te dels Zombies. És un joc molt menys treballat que els anteriors, però és molt millor si hi jugues en un terreny conegut, perquè et serà més fàcil escapar-te.

    A passar-ho bé! Demostreu els vostres coneixements en geografia!

    , , , ,

  • Dimarts 12 agost 2014 per

    Instagram i pimes: estàs a la moda?

    Instagram i pimesPer poc que s’estigui al dia de noves tecnologies i xarxes socials, és senzill haver sentit algun cop que “Instagram creix molt” o bé que “Instagram ho està petant” o fins i tot que “hauries d’estar a Instagram, eh?!?“. Si ens cenyim a les dades estadístiques, Espanya és el 4t país en el rànquing mundial en l’ús d’aquesta xarxa social avui sota el poder de Facebook, només per darrera d’Estats Units, Japó i Brasil. A nivell mundial, el creixement d’Instagram en l’univers dels mitjans socials continua en augment, i el 1r semestre d’aquest any ha tingut un creixement del 25% en el seu volum d’activitat, segons un estudi de Global Web Index. Un altre dels factors a tenir en compte és que Instagram té un públic bàsicament jove, essent el de 16 a 34 anys el 74% de la seva base de dades d’usuaris.

    Instagram per a pimes

    Tenint en compte les estadístiques i d’altres factors com ara que és una xarxa social sense massa competència, és interessant si més no tenir-la en compte sobretot per aquelles empreses que es dediquin als serveis a les persones, i especialment adreçades a persones de menys de 40 anys. Per tant, moda i complements, esports, equipament personal, restauració i gastronomia, turisme o estètica i imatge serien uns bons sectors on plantejar-se l’ús d’Instagram. Ara bé, com en totes les xarxes socials, amb un full de ruta i una estratègia més o menys definida, molt millor. Cal tenir en compte, però, que és una xarxa que demana certa dedicació, pràcticament diària, i que s’acostuma a dedicar temps després de la foto en el seu retoc al mateix aparell mòbil.

    Si tot plegat ens encaixa, ens pot ajudar molt a potenciar la nostra marca, a fer evident allò que “una imatge val més que 1.000 paraules“. L’ús de les etiquetes i de la geolocalització via Foursquare són bones eines per segmentar públic i per crear un catàleg d’imatges d’un lloc determinat, mentre que si utilitzem els microvídeos de 15 segons (millor que els de Vine, que com a màxim són de 6 segons) amb una mica de ganes i creativitat podem obtenir bons resultats per la promoció d’actes, per resumir esdeveniments o per fer promos BBB.

    A més, si disposem d’un mòbil Android podem tenir diferents comptes en un mateix aparell, a través de l’aplicació Instwogram. El tema del multicompte és, probablement, la funcionalitat més demanada pels usuaris de l’app oficial d’Instagram. Posem per cas que voleu tenir un compte personal i un del vostre negoci o professional al mateix dispositiu, amb les mateixes funcionalitats i potencial que l’app original. Doncs això és possible amb Instwogram per Android, mentre que no hi ha cap app coneguda fins al moment per dispositius iOS (algunes apps com Fotogramme o Instapload permeten multiaccount i certes funcionalitats, però no pas totes ni de bon tros).

    Per últim, no podem deixar de dir que si dediquem temps i recursos a aquesta plataforma dins la nostra estratègia de màrqueting online, caldria fer una revisió de la nostra activitat i el seus resultats. En aquest sentit, ens poden ajudar molt eines d’analítica específiques per Instagram com la reconeguda Iconosquare (abans Statigram) o bé com Totems (abans Nitrogram). Ens permetran avaluar la nostra presència, gestionar la nostra comunitat i veure com evoluciona, analitzar etiquetes determinades i el seu impacte, o bé saber els hàbits de publicació del nostre target.

    Alguns exemples

    Una pràctica habitual per tenir referències de per on van els trets, és veure què fan les grans marques que disposen de recursos, pressupost i temps. I en aquest sentit trobaríem diverses referències, però n’hem triat 3 a tall d’exemple.

    D’una banda, Ikea Rússia i el seu ús d’Instagram per promocionar el catàleg de productes. Si hi entreu des del mòbil, podreu veure que es pot clicar sobre els diferents elements que conté cada foto, que és alhora una tipologia de productes.

    L’empresa catalana Pastas Gallo ha apostat per utilitzar Instagram com una plataforma on promocionar els diferents tipus de pasta que fan des d’un punt de vista creatiu i simpàtic. El seu timeline és una oda a la imaginació brutal!

    Per últim, un exemple en forma de vídeo per promocionar un esdeveniment utilitzat per la firma de moda Burberry’s. I es que 15″ donen per més del que pensem!

    Instagram està de moda. I, doncs, estàs a la moda tu?

    , ,

  • Dimarts 5 agost 2014 per

    L’analítica web, una bona aliada de la usabilitat

    Analítica web i usabilitat

    Abans del llançament d’un projecte web no sempre està a l’abast de totes les butxaques poder fer tests d’usabilitat. Amb eines gratuïtes com Google Analytics i amb el domini de tècniques d’analítica web, podrem detectar problemes d’usabilitat i d’experiència d’usuari i, aleshores, treballar perquè els usuaris puguin navegar pel web sense problemes ni entrebancs.

    Fora frustracions: tot web ha de ser usable!

    La usabilitat és la facilitat amb què la gent pot usar una eina (o un web) per aconseguir un objectiu concret. I, de fet, està estretament lligada amb l’accessibilitat i l’experiència d’usuari.

    A l’hora de dissenyar un web és essencial tenir en compte la usabilitat i l’experiència d’usuari, principalment des de 2 punts de vista:

    • Que l’usuari pugui fer les seves tasques (informar-se, subscriure’s, comprar) sense frustrar-se, entenent què ha de fer en tot moment, sense abandonar la pàgina.
    • Que l’empresa o institució pugui assolir els seus objectius: que l’usuari s’informi, que es subscrigui, que compri, que fidelitzi, etc.

    Per tant, sabent que hi ha una finalitat, a totes les parts els interessa que s’hi arribi amb èxit i sense patiments.

    En el procés de creació d’un web – i també més endavant – és important utilitzar tècniques pròpies de la usabilitat, per a detectar si hi ha algun problema: si hi ha continguts que no es comprenen, si l’usuari sap en tot moment què ha de fer, si la crida a l’acció és prou clara, si la nomenclatura utilitzada és la més adequada o no, etc.

    Tant si es té prou pressupost per fer estudis d’usuari com si no, l’analítica web resultarà ser una gran aliada, per ajudar-nos a detectar problemes als nostres llocs web.

    L’analítica web ens dóna pistes sobre possibles problemes en un lloc web

    Amb l’ús de Google Analytics podem estudiar diferents mètriques i la seva evolució al llarg del temps.

    Amb quines coses ens hauríem de fixar?

    • El temps a la pàgina i el percentatge de rebot
      Quan es detecta que el temps de mitjana en una determinada pàgina és mínim, podem intuir que hi ha alguna cosa que falla. Si, a més, el percentatge de rebot és molt elevat, haurem de veure què passa en aquesta pàgina.
      Podem trobar problemes amb la usabilitat d’aquesta pàgina en concret. Per exemple, que no es visualitzi bé des de dispositius mòbils, o que hi hagi un text llarguíssim que no es llegeix ningú i que faci abandonar als usuaris. O, fins i tot, pot passar que els usuaris hi arribin esperant trobar-hi una altra cosa, aleshores s’haurien de revisar la nomenclatura del web i les seves paraules clau.
    • Visitants nous o visitants recurrents i freqüència de la visita
      Amb aquestes dades podem conèixer si el nostre web interessa o no als usuaris. Tenir usuaris recurrents, que ens visitin freqüentment i que facin visites de llarga durada és el millor símptoma de que el nostre web no presenta problemes.
    • Pàgines de sortida
      Una pàgina de sortida és l’última pàgina visitada abans que un usuari abandoni el nostre web. Per tant, cal vigilar-les amb lupa: les pàgines del nostre web que tinguin un alt percentatge de sortides seran les primeres que revisarem per veure què hi passa.
      Imaginem, per exemple, que tenim web de comerç electrònic i que, en el procés de compra, un alt percentatge d’usuaris abandona a l’hora de posar les dades personals. Hauríem de revisar bé el procés i mirar si hi ha un problema amb el formulari, si demanem les dades abans d’hora o què hi passa realment.
    • Els embuts de conversió
      Una de les parts més interessants que ens ofereix Google Analytics i de la que en podem treure més suc és la creació d’objectius (per exemple, aconseguir la subscripció de l’usuari a un butlletí o, en un web d’e-commerce, aconseguir la venda) i la creació d’embuts de conversió.
      Un cop s’han determinat els objectius del web, els embuts de conversió són la representació gràfica dels passos que fa l’usuari fins a arribar a aquests objectius. Ens poden donar pistes molt valuoses sobre possibles problemes d’usabilitat en formularis, carros de la compra, passarel·les de pagament, etc. Perquè visualitzem exactament en quin punt es perden els usuaris.

    L’analítica web (també), a la recerca de solucions!

    Un cop detectats els possibles problemes d’usabilitat que pugui tenir el nostre lloc web, encara hi ha un parell de coses que podem fer.

    • Els tests A/B
      Un test A/B és un mètode que ens permet comparar dues o més versions d’un lloc web, sense que els usuaris ho sàpiguen, de manera que el mateix contingut d’una pàgina s’ofereix aleatòriament en diferents dissenys o estructures. En un apunt de fa un temps sobre com vendre més a Internet, us explicàvem que des de Google Analytics es poden crear aquest tipus d’experiments.
      Una vegada identificada la pàgina on creiem que hi ha un problema d’usabilitat, podem fer versions de la pàgina amb petites variacions que podem anar seguint al llarg del temps i analitzar en quin cas es corregeix el problema.
    • Velocitat del lloc
      Finalment, la velocitat del lloc també és determinant a l’hora d’oferir una bona experiència d’usuari. Una descàrrega lenta en un web és un dels principals factors d’abandonament dels usuaris.
      Però, a més a més, la velocitat en què es carrega una pàgina cada vegada esdevé més un aspecte clau perquè solem navegar des de dispositius mòbils, moltes vegades amb connexions nefastes, i amb la urgència d’accedir a les informacions al moment. Els usuaris tenim poca paciència i sinó abandonem. Per tant, també s’ha de treballar fort en aquest sentit.
      L’analítica web ens permet monitoritzar la velocitat de càrrega de les pàgines i ho podem fer també amb eines gratuïtes. Amb Google Webmaster Tools se’ns propociona informació de la velocitat de descàrrega del lloc web, però, a més, si ho vinculem al compte de Google Analytics, també ens dóna suggeriments sobre com millorar aquesta velocitat de descàrrega.

    Així que, encara que el nostre web presenti problemes, la bona notícia és que amb uns coneixements bàsics d’analítica web, seguint unes quantes mètriques i amb l’ús només d’eines gratuïtes, podem treballar per aconseguir grans millores. Està a l’abast de tothom aconseguir fer webs més eficaços.

    , , ,

  • Dimarts 8 juliol 2014 per

    ODL, Laboratoris de dispositius oberts


    Fins fa relativament poc temps, en el món del desenvolupament web n’hi havia prou amb testejar el producte en els 4 o 5 navegadors principals per assegurar-se que tot anava bé.

    En els darrers anys, però, i amb l’explosió de la web mòbil, i sobretot el disseny adaptatiu, s’ha arribat a un punt en què es fa molt necessari poder comprovar la feina feta en quants més dispositius diferents millor. És a dir, a part de l’ordinador de sobretaula, cal comprovar que el que hem dissenyat i desenvolupat es veu i funciona correctament en diferents tipus de dispositius mòbils, sistemes operatius, fabricants, models…

    No és habitual tenir a mà tanta varietat de dispositius per comprovar la feina feta, i per això s’han creat els Open Device Labs, ODLs o Laboratoris de dispositius oberts. Aquests laboratoris són espais que diposen de la varietat de maquinetes necessària per facilitar la feina als desenvolupadors web. Un desenvolupador pot anar a un ODL i allà hi trobarà una varietat de mòbils i tauletes que li facilitaran la feina de testeig del seu web o aplicació.

    Els ODL es nodreixen d’aportacions voluntàries de gent que dóna dispositius que ja no utlitza, per tal de nodrir el laboratori i contribuïr a millorar així la feina dels desenvolupadors.

    Si busqueu un ODL prop d’on viviu, a Opendevicelab.com ho podreu fer. Aquest web és un recull dels ODL que hi ha per tot el món, amb dades sobre quins dispositius hi podem trobar, i opinions d’usuaris que hi han anat a treballar. Si tenim algun aparell que ja no utilitzem, a través del web també podem fer-ne donació a algun dels ODL que tinguem més a prop de casa.

    Labcase, un ODL a casa

    Com que no sempre és possible trobar un d’aquests laboratoris a prop, i tampoc ens podem permetre agafar un avió cada cop que ens calgui testejar la feina, s’ha creat un altre servei similar, tot i que encara no està en marxa. S’anomena Labcase, i la idea és la de portar-te el laboratori a casa. Labcase estarà disponible en principi només al Regne Unit. Quan algú faci la sol·licitud, li arribarà una maleta amb deu dispositius mòbils amb els quals treballar durant una o dues setmanes.

    Tot i que aquestes iniciatives són molt recents, sobretot per aquí a prop, no deixen de ser interessants i ens fan donar compte de la importància que té la comprovació de la nostra feina en dispositius reals. Esperem que aquestes iniciatives proliferin i ens en poguem beneficiar tots plegats.

    , , ,

  • Dimarts 15 abril 2014 per

    Inici.info, la pàgina d’inici més útil pel teu navegador

    Inici.info, la pàgina d'inici més útil per al teu navegadorSi comptéssim l’estona que triguem cada dia en fer cerques per Internet, veuríem que déu n’hi do les vegades que arribem a cercar-hi coses: que si un article, que si una recepta, que si una cançó de tal grup, que si una imatge de tal cosa, que si allò que vaig guardar a l’Evernote, que si aquell butlletí que vaig rebre, que si vull comparar preus d’una tauleta que em vull comprar…

    Doncs, bé, fa uns dies he descobert una pàgina que em té meravellada per la seva simplicitat i per la seva utilitat: inici.info. Es tracta d’una pàgina d’inici definitiva. De veritat, ja triguem tots a configurar-nos-la com la nostra pàgina d’inici del navegador, ja que ens farà més productius perquè anirem a allò que cerquem d’una manera més fàcil i ràpida.

    Podem ser més productius! Posant inici.info com a pàgina d’inici del nostre navegador, farem cerques a la Xarxa d’una manera molt més ràpida i eficient.

    La iniciativa és de dos germans, Daniel i Francesc Farré, que fa un parell d’anys van engegar aquest projecte i que, tot i que ara encara està en beta, ja se li pot veure la brutal utilitat.

    Inici.info cerca a Google per defecte, però, a més, permet cercar directament a mapes, a imatges, a la Viquipèdia, al correu de Gmail, al calendari, a Twitter, a Facebook, a Linkedin… Permet cercar música, vols o hotels, cercar a l’eBay, cercar rutes al wikiloc, consultar el temps, receptes… Feu-hi una ullada, que el llistat d’eines i webs és molt complet i molt útil!

    Com funciona?

    • Si escriviu un text i premeu la tecla Enter, cercareu a través de Google. És a dir, funciona com si tinguéssim la pàgina del cercador de Google com a pàgina d’inici.
    • Però, en canvi, si escriviu un text i feu clic en una icona, cercareu directament al lloc o servei que heu escollit: mapes, fotos, diccionari, traductor, Viquipèdia… Un bon llistat de serveis on cercar. Ep, i sense passar pels resultats de Google!
    • Si cliqueu a una icona sense escriure res, les icones resulten un accés directe.
    • La icona principal d’inici.info – la fletxa que hi ha a la part superior – és un accés ràpid a qualsevol pàgina web. Per exemple: si escrivim antaviana i cliquem la icona, anem directament a http://www.antaviana.cat.
    • Si treballem des d’un ordinador, podem utilitzar el doble clic sobre una icona per obrir la nostra cerca en una nova pestanya.
    • La pàgina funciona per ordinadors, tauletes i mòbils.

    El disseny

    La pàgina és una al·legoria a la simplicitat: han creat un espai lliure de distraccions i publicitat. S’ha d’anar per feina.

    El disseny de la pàgina és minimalista amb unes icones ben dissenyades, només en blanc, negre i gris. La utilitat per damunt de tot, però amb un disseny agradable i gens molest. M’agrada.

    La seguretat

    A nivell de seguretat, la pàgina no utilitza cookies ni cap altra dada personal. Hi ha alguns serveis com Gmail, Calendari, Evernote… que si no estem loguejats en aquella sessió del navegador, no funcionen. El compromís de la gent d’inici.info és no guardar cap tipus de contrasenya ni dada personal: simplement fan la cerca i, si hi ets com a usuari, et funciona.

    Extensions i mòbils

    L’objectiu principal de la iniciativa és que ens posem inici.info com a pàgina d’inici per defecte del nostre navegador, però, a part, la pàgina disposa també d’una extensió per Google Chrome.

    Ara mateix no tenen aplicació mòbil desenvolupada, però sí que ens expliquen com configurar els nostres mòbils per a posar també aquesta pàgina d’inici: en Android i en iOS.

    En definitiva, és una pàgina útil que hem de tenir a propet i estar pendents de les seves millores, perquè segur que en sentirem a parlar.

    , , ,

  • Divendres 28 març 2014 per

    50 eines i recursos per a escollir colors en disseny web

    Recull d'eines per a treballar en colors - Disseny webTots sabem que els colors transmeten emocions i que, en disseny web, és molt important fer una bona elecció de la paleta de colors. Així, depenent dels colors que utilitzem, transmetrem uns valors o uns altres d’acord amb el tarannà de l’empresa o institució per la qual estiguem treballant.

    Fa temps, en aquest mateix blog, us parlàvem dels esquemes de colors, però avui us volem presentar un llistat molt més exhaustiu d’eines i recursos que us ajudaran a l’hora d’escollir els colors per als vostres dissenys.

    Eines genèriques per a treballar amb el color online

    • Colorhexa
      Donant un codi de color, t’ofereix un munt d’informació sobre paletes de colors, ombres i tints, variacions del mateix to, conversions en altres formats de color… I també un simulador per a persones amb deficiència en la visió del color.
    • Kuler
      És una de les millors eines de creació d’esquemes de color, de la mà d’Adobe.
    • Color Scheme Desginer
      Amb una bonica interfície, ofereix un munt d’eines per a escollir colors i les seves variants. Té magnífiques opcions d’exportació (HTML + CSS, XML i paletes de Phothospo o de Gimp). També té opcions d’accessibilitat, amb el “colorblind”, que et permet simular com ho veuen les persones amb algunes de les deficiències més habituals en la visió del color.
    • Color Explorer
      Ofereix un recull d’eines molt completes per al tractament del color, per a crear i convertir la teva paleta de colors i també permet escollir colors dels esquemes de colors més coneguts i un convertidor de formats i un analitzador de contrast.
    • Color blendy
      Permet anar generant els colors al moment i visualitzar el millor resultat
    • Color combinations tester
      Per a crear combinacions de colors
    • (Actualitzat Nov- 2018) How Colors Work on the Web in 2018
      Una bona guia per entendre els diversos usos del color aplicat al web i com declarar les seves codificacions en RGB, codi hexadecimal, etc.

    Eines per a extreure els colors a partir de pujar una imatge

    Webs on inspirar-se, crear o compartir paletes de colors

    • Color lovers
      És una comunitat online on els afeccionats al color poden crear, compartir i navegar per diferents paletes de color, compartir colors, patrons, parlar sobre les darreres tendències en colors i llegir articles sobre color.
    • Instant Color Schemes
      Esquemes de color generats analitzant l’API d’imatges de Yahoo.
    • ColorRD
      Per a crear i compartir la inspiració relacionada amb els colors.
    • Color Combos

    Eines per agafar colors (color pickers)

    Altres eines curioses

    • Multicolr Search Lab
      Cercador d’imatges a partir del color: tenint com a base 10 milions d’imatges de Flickr, et permet cercar imatges escollint fins a 5 colors. Molt útil per trobar imatges de determinades tonalitats.
    • Stylify Me
      Una eina molt útil! Introdueixes la URL d’un web i et retorna els colors i també els estils principals utilitzats en aquest web.
    • Check my colors
      Com en el cas interior, introdueixes una URL i et dóna els colors utilitzats i valora si hi ha algun problema amb el contrast, lluminositat, etc.
    • Brand colors
      Per a inspirar-se: t’ofereix els codis de color del color corporatiu de moltes marques conegudes
    • Colorzilla
      Extensió molt útil per a Firefox per a agafar els colors dels webs que es visiten

    Infografies interessants

    Teoria del color

    Esperem que us sigui ben útil!

    , ,

Disseny web - Antaviana

Truca’ns +34 973 143 481

Envia’ns un correu informacio@(ELIMINAR)antaviana.cat

Piula’ns a @canantaviana

o Vine a visitar-nos