Not Signed-In
Which clippings match 'Grid System' keyword pg.1 of 2
04 OCTOBER 2013

Josef Muller-Brockmann: the grid system and the golden ratio

"Muller Brockmann published several books, including The Graphic Artist and His Problems and Grid Systems in Graphic Design. These books provide an in–depth analysis of his work practices and philosophies, and provide an excellent foundation for young graphic designers wishing to learn more about the profession."

1

2

3

TAGS

Bauhaus Schoolclear communicationconsistencyDe Stijldesign formalismdesign principlesgolden ratiographic designergrid systemInternational StyleJosef Muller-Brockmannposter design • quantities • Russian constructivismSuprematism • Swiss International Style • Swiss Style • typographic consistency • University and Kunstgewerbeschule • visual communication • visual consistency • visual designvisual hierarchyvisual simplicitywhitespace

CONTRIBUTOR

Simon Perkins
24 SEPTEMBER 2013

Bootstrap: open-source front-end web design toolkit

"Bootstrap is an open–source front–end toolkit created to help designers and developers quickly and efficiently build awesome stuff online. Our goal is to provide a refined, well–documented, and extensive library of flexible design components built with HTML, CSS, and JavaScript for others to build and innovate on."

(Mark Otto, 17 January 2012, A List Apart)

1

TAGS

2011960 Grid SystemA List ApartBootstrap (toolkit) • collection of tools • component systemCSSdesign for the screendesign template • flexible design components • free collection • front-end developmentGitHubgrid system • Hackweek • HTML • interface components • interface design • Jacob Thornton • JavaScriptlayout • Mark Otto • open sourcepage designpage layoutresponsive design • responsive grid system • software frameworkstyle guidetechnology solutiontoolkittoolsTwittertypographyweb applicationweb designweb developmentweb layoutwebsite

CONTRIBUTOR

Simon Perkins
25 APRIL 2013

Contemporary kinetic typography relies on historical developments

"This is a lecture given to MA students at the University of Hertfordshire. It explores how contemporary kinetic typography relies on historical developments such as 3D woodblock print, Romain du Roi, and Modernist modular lettering. Students are encouraged to let their design work respond to historical research. This does not mean creating something that looks old or retro, rather creating something innovative and new by re–imagining historical ideas in light of new technologies and contexts."

(Barbara Brownie)

1

TAGS

3D typography • Academie des Sciences • architectural formsart and design • Barbara Brownie • Bauhaus School • borrowing from the past • Channel 4Channel 4 identchannel identDe Stijl • design nostalgia • grid systemhistorical developmentsJosef Alberskinetic typographyKyle Cooper • learning from history • lecturemachine aesthetic • malleable typography • modular typography • modularity in designmorphingparodypostmodern pasticheprimitive shapesprimitivesrecontextualisation • reinvention • remediation • retrievalism • retroRoland Barthes • Romain du Roi • School of Creative Arts • Stencil (typeface) • TV identtypographic animationtypographyunified wholeUniversity of Hertfordshirevisual abstractionwoodblock printing

CONTRIBUTOR

Mary-joy Ashley
11 MAY 2012

Luke Wroblewski on: Multi-device Layout Patterns

"Through fluid grids and media query adjustments, responsive design enables Web page layouts to adapt to a variety of screen sizes. As more designers embrace this technique, we're not only seeing a lot of innovation but the emergence of clear patterns as well. I cataloged what seem to be the most popular of these patterns for adaptable multi–device layouts."

(Luke Wroblewski, 14 March 2012, via Christopher Allwood)

1

TAGS

adapt to screen sizes • adaptable multi-device layout • adaptive layoutBBC • column • column drop • columnscommunication design • design for large screen • design for mobiledesign for the screendesign innovationFacebook • Five Simple Steps • fluid grids • Food Sense (website) • Google (GOOG)grid systemHCI • image layout • information architectureinteraction designinterface designlayout • layout adjustments • layout designlayout patterns • layout shifter • layouts • Luke Wroblewski • margins • media query adjustments • mobile design • Modernizr • mostly fluid • multi device • multi-column layout • multi-devicemulti-device adaptation • multi-device layout patterns • multiple screen sizes • NUI • off canvas • optimised for mobilepage layoutpage layout pattern • Path (app) • responsive design • responsive design layout patterns • responsive web design • screen size • screen sizesscreen space • single column layout • small screen • small screen sizes • small screens • stacking • stacking columns • The Boston Globe • tiny tweaks • Trent Walton • UIusabilityvisual communicationvisual screen designweb designweb page layoutsweb pageswebsite

CONTRIBUTOR

Simon Perkins
20 APRIL 2012

Principles of the Visual Language: A Dialect of Our Own Design

"A visual language informs all design, from architecture to print. Fluency in the same language drawn on by Bauhaus, mid–century Swiss, or postmodern design is essential for brilliant web design. In this practical talk, ground uniquely web–based interactions – from complex CSS3 animations and rotations to JavaScript behaviors – using that time–tested visual primer. Take a more considered approach to choices, evoke the desired emotive responses, learn how to better articulate your design decisions. Extend graphic design's grammar into a visual dialect of web design that guides us to smarter, beautifully balanced juxtapositions of elements in our new, multidimensional web experiences."

(Simon Collison)

Fig.1 Simon Collison (03 June 03 2011) "A Dialect of Our Own Design".

1

TAGS

aestheticsaffordances • articulate your design decisions • Bauhaus School • beautifully balanced • Christian Leborgcommunication design • considered approach • CSS3 • CSS3 animation • Dan Brown • design formalismDonald Normanediting through selection • emotive response • framegestalt principlesgraphic design • graphic design visual grammar • graphic representationgrid systemIndi YoungInternational Typographic StyleJavaScriptmapping • Mark Boulton • mental modelspictorial systemspostmodern designresponsive web designschema • Scott McCloud • Simon CollisonSlideShareSwiss Styletypographyvisual communication • visual dialect of web design • visual grammarvisual languagevisual screen designweb design • web experiences • web-based interactions • Wucius Wong

CONTRIBUTOR

Simon Perkins
Sign-In

Sign-In to Folksonomy

Can't access your account?

New to Folksonomy?

Sign-Up or learn more.