Skip to content

Instantly share code, notes, and snippets.

@SteveBarnett
Created August 27, 2015 09:59
Show Gist options
  • Save SteveBarnett/cf1dffe6ed2362d0b5f2 to your computer and use it in GitHub Desktop.
Save SteveBarnett/cf1dffe6ed2362d0b5f2 to your computer and use it in GitHub Desktop.
Thoughts from looking at some responsive apps
  • Block level elements can become select-like items of larger screens
  • Anchors / accordions become tabs
  • Simple layouts becomes centered, with side padding to keep a good measure
  • Block level display becomes inline-blocks, at break points
  • Simple step navigation (Next > Edit Campaign) becomes breadcrumbs (Name > Edit > Publish)
  • One columns becomes two, by row, to keep context
  • Use arrow instead of burgerto indicate directions / movement
  • Off-canvas stacked layers. Must have multiple navitation controls: <- arrow for back, Save and Cancel buttons.
  • Off-canvas menus come on screen when there's enough room for them.
  • Smart defauts -> Short list of popular / recent -> detailed selection if needed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment