the future is modulair - new approach to web design
DESCRIPTION
inspired by the superb congres #FOWD in London April 2014. This talk held @freelancefriday in Amsterdam 12 September 2014TRANSCRIPT
The Future is Modulaira new approach to websites building
12 Sep 2014 Amsterdam@freelancefriday venue @de_ Zwijger @wpmariken
1
The Future …..
2
….. modulair
3we are moving away from pages to webpages built from bits and pieces.
from pages to ….
we no longer look at webpages as pages. The structure of the internet has changed.
4
Remember him?
http://youtu.be/rR8XkWek7E4
“not true to the web”... you’re signing of on a picture of the website”
About designing a website in Photoshop. Hear what Brad Frost says in this interview with Treehouse (from 0.38 to 0.55” small part of the interview)
http://youtu.be/5J7mq0ogwBI
Tim Berners Lee
back then it’s was ment for publishing and distributing scientific documents
What is our canvas?
...“create interaction …. start with a story board”...
Rachel Nabors’ approach.She blends the art of traditional storytelling with digital media “to tell beter stories through code”
new canvas?
...“things we as web designers can potentially learn from the world of theatre.”....
Luke Murphy- Wearmouth sees a lot of parallels with theatre production.
Reframing the Web http://lanyrd.com/2014/fowd/scwxrt/
new canvas?
...“non-linear digital narratives: disjointed stories, parallel narratives, even embedded memories……
….we can create non-linear narratives that exist as the perfect storytelling format for the web.....
…we have the digital tools at our fingertips….
Senongo. http://lanyrd.com/2014/future-of-web-design-nyc/sdbwry/http://senongo.net
new canvas?
we need something that:
! works well on all screens
! can easily present information coming from many sources
! can support personalization of content and provide a unique
experience to everyone.
Paul Adams #FOWD April 2014 London
12 Sep 2014 Amsterdam@freelancefriday venue @de_ Zwijger @wpmariken
√ screens
we have the technical solutions to get our websites looking good on all screen sizes.
frameworks:Bootstrap - TwitterFoundationSkeleton & more
Linda van Deursenhttp://alistapart.com/article/content-out-layout
√ screens
Grids do not exist in a vacuum. They exist in relation to the content. We never start with a grid. We start with an idea which is then translated into a form, a structure.
√ screens
plenty of tools tout there.
We need something that:
√ works well on all screens
! can easily present information coming from many sources
! can support personalization of content and provide a unique
experience to everyone.
Paul Adams #FOWD April 2014 London
12 Sep 2014 Amsterdam@freelancefriday venue @de_ Zwijger @wpmariken
√ sourcesre-architecture of the web,
away from pages and destinations, towards
completely personalised experiences built on an
aggregation of many individual pieces of content.
So ... stuff/ data from other sources is uploaded and displayed on our website
cards have arrivedand on more platforms
cards on Google
http://www.google.com/landing/now/
why are cards so promising?
with Google cards you can provide your customer with personalised information. Upon preferences/ location/needs etc..
cards on Twitter
https://dev.twitter.com/cards
crazy card tricks
http://davidwalsh.name/demo/css-flip.php
cards are fun.
with css3 you can do a lot of tricks. - flip - swipe - place them on top of each other -zoom in /zoom out.
more card tricks
http://designshack.net/articles/css/css-card-tricks/
cards do a good job specially on mobile.
Take small space, are easy to arrange, carry a lot of information.
We need something that:
√ works well on all screens
√ can easily present information coming from many sources
! can support personalization of content and provide a unique
experience to everyone.
12 Sep 2014 Amsterdam@freelancefriday venue @de_ Zwijger @wpmariken
1
√ personalization
1
√ personalization
1
users of your website bring data. Via social check-in they bring their frends, preferences and maybe more...
● personalization
1
√ personalization
a review of a friend of my friend (on Facebook). check the “friends first setting”
from other sources
We need something that:
√ works well on all screens
√ can easily present information coming from many sources
√ can support personalization of content and provide a
unique experience to everyone.
Paul Adams #FOWD April 2014 London
12 Sep 2014 Amsterdam@freelancefriday venue @de_ Zwijger @wpmariken
What about my little website?
from Dan Mall’s talk @ Smashing Conf 2013
Quote Do not focus on the goals, concentrate on the motivation
business goals vs. user needs
Talking about needs- motivation:Would I like this colorfull and entertaining website when I want my passport renewed?
Thumbs up for the gov.uk project
Serve your customer
My challenges:
● Better performing websites
● API’s and SDK’s
● rethink WordPress (as a CMS only and less as a building platform)
On my to do / learn list:
● Github ● S_● Flexbox● CSS animations● Sass or Less
Thanks to : Future Of Web Design, London #FOWD Paul Adams @padday
Paul Boag @boagworld
Harry Roberts @csswizzardry
Luke Murphy- Wearmout @lurkmoophy
Rachel Nabors @rachelnabors
more about cards: http://insideintercom.io/why-cards-are-the-future-of-the-web
??
:)
Links to : Harry Roberts on CSS frameworkshttps://speakerdeck.com/csswizardry/what-is-a-css-framework-anyway
Luke Murphy- Wearmout on reframing the web:http://lanyrd.com/2014/fowd/scwxrt/
Rachel Nabors article:http://alistapart.com/article/web-animation-at-work
more about cards: http://insideintercom.io/why-cards-are-the-future-of-the-web
??
:)
