Designing for the Unknown
-
Upload
richardhealybasekit -
Category
Internet
-
view
263 -
download
3
description
Transcript of Designing for the Unknown
DESIGNING
UNKNOWN
RICHARD HEALY, BASEKIT @RICHARDHEALY
for the
BASEKITPART ONE
/01 /50
/02
5 YEARS FOUNDED 2009
40,000 BK WEBSITES CREATED EVERY MONTH
1.5 MILLIONBASEKIT WEBSITES CREATED
OVER 100 PARTNERS IN OVER 40 COUNTRIES
/50
/03
V6
FREEFORM DRAG & DROP
A VISUAL EDITOR
APP DRIVEN DESIGN
CONTENT, POSITIONING & STYLING
DATA DRIVEN
UNDERPINNING OF HTML / CSS
BUSINESS FOCUSED
INTRODUCED THE ZONE
V7
/50
/04
THE V7 PRODUCT/50
/05 /50
/06
IMAGES UPLOADED WORLDWIDE
880 BILLION
571 WEBSITES CREATED EVERY MINUTE
4 MILLION IMAGES UPLOADED TO BASEKIT
AVERAGE 3 PAGES 74,000,000 PAGES OF CONTENT EVERY MONTH
/50
HOW DOES THIS HELP?PART TWO
/07 /50
DESIGNER
CLIENT
hey, send over that content and i’ll start the design!
hi! just start designing then i’ll add in the content
content first!design please!
/08 /50
/09
YOU DON’T NEED THE CONTENT BEFORE
DESIGNING/50
/10
EVERYONE IS HAPPY! DITCH THE STATIC DESIGN PATTERNS
EASY TO MAINTAIN CLIENTS CAN MANAGE THEIR CONTENT
BETTER CONNECTIVITY BETWEEN YOUR DESIGN AND THE CLIENT
AMAZING DESIGN SMALL AMOUNTS OF CONTENT THAT WILL GROW
/50
/11
WHAT I’M ABOUT TO SHOW HEALY.ROCKS
/50
/12
THE STARTING POINT
/50
/13
MINIMAL CONTENT
/50
/14
THE FLOATING FOOTER HEALY.ROCKS
healy.rocks/footer1/50
/15
DESIGNER IDEALS vs REALITY HEALY.ROCKS
FLEXBOXdisplay: flex;
/50
/16
.container { display: flex; }
/50
/18
THE POWER OF FLEXBOX HEALY.ROCKS
home about us portfolio contacthome about us portfolio contacthome about us portfolio contact
/50
/19
THE POWER OF FLEXBOX HEALY.ROCKS
display: flex; align-items: center ;
justify-content: center ;
/50
/21
IMAGES 70%20%10%
/50
/22
THE POWER OF FLEXBOX HEALY.ROCKS
/50
/23
THE POWER OF FLEXBOX HEALY.ROCKS
/50
/24
THE POWER OF FLEXBOX HEALY.ROCKS
/50
/25
THE POWER OF FLEXBOX HEALY.ROCKS
/50
/26
HEADERS
/50
/27
ABOUT HEADERS HEALY.ROCKS
AWESOME COMPANY NAME
home about us portfolio contact
AWESOME COMPANY NAME
home
/51
/28
ABOUT HEADERS HEALY.ROCKS
AWESOME COMPANY NAME homeAWESOME COMPANY NAMEabouthome contact
portfolioservices
/50
/29
ABOUT HEADERS www.healy.rocks
AWESOME COMPANY NAME
home about us portfolio contact
/50
/30
NAVIGATION HEALY.ROCKS
/50
/31
LOGOS
/50
/32
ABOUT LOGOS HEALY.ROCKS
616 X 324
/50
/33
ABOUT LOGOS HEALY.ROCKS
AWESOME COMPANY NAME
616 X 324/50
/34
ABOUT LOGOS HEALY.ROCKS
AWESOME COMPANY
616 X 324/50
/35
BEST LAYOUT FOR UNKNOWN CONTENT HEALY.ROCKS
home about us portfolio more ▾
AWESOME COMPANY
/50
/36
NAVIGATION USING FLEX BOX HEALY.ROCKS
home about us portfolioAWESOME COMPANY
min-width:460px;
/50
/37
NAVIGATION USING FLEX BOX HEALY.ROCKS
home about us portfolioSUPER AWESOME COMPANY
/50
/38
NAVIGATION USING FLEX BOX HEALY.ROCKS
SUPER AWESOME COMPANYhome about us portfolio services contact
/50
/39
NAVIGATION USING FLEX BOX HEALY.ROCKS
SUPER AWESOME COMPANYhome about us portfolio services contact
/50
/40
NAVIGATION USING FLEX BOX HEALY.ROCKS
home about us portfolioAWESOME COMPANY
/50
/41
NAVIGATION USING FLEX BOX HEALY.ROCKS
home about us portfolioAWESOME COMPANY
/50
/42
ELEMENT QUERY
/50
/43
TYSON MATANICH SMASHING MAGAZINE
http://www.smashingmagazine.com/2013/06/25/media-queries-are-not-the-answer-element-query-polyfill/
/50
/44
.companyname[min-width~="769px"][max-width~="960px"] { text-align:center; }
/50
/45
DEMO
/50
/46
CONCLUSION
/50
/47
1. THINK MINIMAL
/50
/48
2. THINK FORWARD
/50
/49
3. THINKING BEYOND
/50
THANKS!
RICHARD HEALY, BASEKIT @RICHARDHEALY @BASEKITDEVS
/FIN
/SOURCES
ACCREDITATION SOURCES
In July 2013, it was estimated that 571 new websites are created every minute. (source: http://goo.gl/7AWpDd) !267 babies born a minute (http://goo.gl/qJPfDB) !880 Billion photos taken in 2014 (source: http://goo.gl/Be94LV) !Roughly, 1.8 billion are uploaded and shared via social media every day (source: http://goo.gl/LMg0u5) !Flexbox usage as of Oct, 2014 (source: http://caniuse.com/#feat=flexbox) !Images from thinkstock.co.uk !Special thanks to http://twitter.com/roryvaux for amazing slide design!