Hola hola hola Hola hola hola

barcelona.cat/barcelonactiva

Recordeu mantenir desconnectades la vostra càmera i micròfon per evitar interferències.

Les preguntes es fan principalment pel xat. Si no disposeu d’aquesta icona, pengeu, elimineu cookies (o accedir en una pestanya en incògnit) i torneu a accedir. Si segueix sense aparèixer, pots fer servir el xat d'emergència o fer les preguntes a través del micròfon.

La presentació i els recursos utilitzats en aquesta sessió els trobareu aqui:

En breus moments començarà l’activitat

Normes d'ús per a la participació en les Aules Virtuals

barcelona.cat/barcelonactiva

n1n.eu

Hola hola hola Hola hola hola

barcelona.cat/barcelonactiva

12 tendències innovadores de disseny web per al 2020

Octubre 2019

Barcelona Activa, l’agència de desenvolupament econòmic i local de l’Ajuntament de Barcelona

barcelona.cat/barcelonactiva !3

La nostra missió

Impulsar la política econòmica i el desenvolupament local per promoure la millora de la qualitat de vida de les ciutadanes i ciutadans de Barcelona a través del foment de l’ocupació, l’impuls de l’emprenedoria i el suport a les empreses, responent a les diferents necessitats de les persones en el seu territori i des de la perspectiva de l’economia plural, que inclou, entre altres, l’economia social i solidària.

Potenciar l’empoderament de la ciutadania i el reequilibri entre territoris per assolir un model just de desenvolupament econòmic, així com de creació, manteniment i repartiment de l’ocupació.

Barcelona Activa, l’agència de desenvolupament econòmic i local de l’Ajuntament de Barcelona

barcelona.cat/barcelonactiva !4

Què fem?Acompanyem la ciutadania durant tot el procés de recerca de feina

barcelonactiva.cat/treball

Donem suport a les persones emprenedores per fer

realitat la seva idea de negoci, sigui de forma

col·lectiva, comunitària o individual

barcelonactiva.cat/ emprenedoria

Oferim formació tecnològica a les

persones que cerquen feina, emprenedores

i professionals

barcelonactiva.cat/ cibernarium

Ajudem les empreses i organitzacions a créixer, connectar-se amb l'ecosistema i consolidar-se amb models socialment responsables

barcelonactiva.cat/empreses

I tot això ho fem en clau de territori,

incloent la perspectiva de gènere i la diversitat

des d'una visió d'economia plural

Exercicis / 01 - Exercicis Flexbox / 05 - align-items

Barcelona Activa, l’agència de desenvolupament econòmic i local de l’Ajuntament de Barcelona

barcelona.cat/barcelonactiva !5

Equipaments al servei de la ciutat

Barcelona Activa, l’agència de desenvolupament econòmic i local de l’Ajuntament de Barcelona

barcelona.cat/barcelonactiva !6

Barcelona Activa, molt present als barris

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !7

12 tendències innovadores de disseny web per al 2020

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !8

El disseny no és estèticaEl disseny tracta de resoldre problemes. L’estètica tracta sobre bellesa.

El disseny pretén ser objectiu, mentre que l’estètica sempre és subjectiva.

El disseny és sobre l'usuari, l'estètica és sobre l’artista.

Dissenyar vol dir pensar abans de fer.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !9

El bon disseny no passa de moda

Un bon disseny prioritza la funcionalitat sobre l'estètica.

Un bon disseny ha de ser invisible, per això és immune a les modes.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !10

12 tendències per al 2020

Nota: Les tendències aquí comentades només són aixó, tendències i no reflecteixen necessàriament la meva opinió sobre disseny.

Tendència Patró de comportament dels elements d'un entorn particular durant un període de temps determinat.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !11

1. Disseny asimètric

Els dissenys web asimètrics són els millors quan es tracta de captar l’atenció.

Home Societe

La majoria de webs estan basades en quadrícules i reixetes i això era massa evident.

MAT

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !12

2. Minimalisme sobretot als menús

Rubrasonic

El minimalisme és la reducció d’elements.

Però el que realment importa és la simplicitat, que és la reducció de complexitat.

Ben Bodien

SimplicitatMinimalisme

Publii

Gestor de continguts minimalista i gratuit.

Curs PubliiLeen Heyne

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !13

3. L'espai en blanc no és un forat

Progressive punctuation

L'espai en blanc és un element essencial ja que crea un disseny equilibrat i harmoniós

Permet una lectura més fàcil

Prioritza els elements de la interfície d'usuari

Guia als usuaris en una pàgina

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !14

4 TIPOGRAFIES GEGANTS

Headery

La tipografia és cada vegada més audaç i substitueix la imatge, ara una imatge és una paraula.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !15

5. Colors vius i degradats

Viu de pressa, mor jove i tindràs una bonica

obsolescència programada.

Elje Group

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !16

6. Dibuixos a mà

Mailchimp.com

Els elements de disseny imperfectes i els dibuixats a mà aporten personalitat als llocs web i li donen humanitat.

Enlaces Spimebox Repositoris d'il·lustracions i dibuixos gratuïts

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !17

7. Gràfics vectorials

Imatge Vectorial Imatge de mapa de bits

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !18

8. Vídeo de fons

Arts and Culture

Els vídeos a gran escala són la oportunitat d'impressionar als usuaris, mentre es fa servir el mínim de text.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !19

9. Microinteraccions

Lord Icon

Les microinteraccions són petits elements de disseny interactius que tenen un paper important en la creació de llocs web amb sentiment humà.

LootieLlibreria desenvolupada per airbnb per reproduir animacions interactives en temps real

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !20

10. Tridimensionalitat

Wine CO Falsa tridimensionalitat

Algunes 'noves' tendències no són noves, simplement van arribar a la corrent principal a causa de la disminució de les seves barreres d'entrada.

El 3D era molt car i fora de l'abast de la majoria dels dissenyadors.

Inside Nahuku3D VR

MOM Objectes 3D

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !21

11. Formularis que no ennuegnan (no atragantan)

Typeform

Evita els formularis interminables i amb tots els camps obligatoris.

Els mercats són conversacions.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !22

12. Primer el mòbil, després mode fosc, veu i chat bots

Drinkdefy.commode fosc - 3D - video de fons - asimetria

Ara es dissenya primer per a dispositius mòbils i després s'ajusten per a escriptoris. Al fer-ho d'aquesta manera, els llocs web s'assemblen a les aplicacions i poden ajudar amb el màrqueting omnicanal.

Els dissenys web en mode fosc són agradables a la vista i fan que els colors i els elements de disseny destaquin i té un principi pràctic. Els temes foscos són millors per a les pantalles OLED dels mòbils.

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !23

El codi també té tendències: CSS i Javascript

State Of JavaScript Enquesta anual de tendències CSS

The State of CSS Enquesta anual de tendències CSS

12 tendències innovadores de disseny web per al 2020

barcelona.cat/barcelonactiva !24

Bonus: Accessibilitat

L'accessibilitat és cara i difícil i les webs accessibles són lletjas.

El cec més important del món és diu Google.

Avantatges Arribar a un públic més ampli Té una millor usabilitat És més compatible amb SEO. Les pàgines carreguen més ràpid

Campaign Monitor

Apple