-
Navigation
the combination of organization, labeling, & navigation schemes within an informational system
-
Interaction
the structural design of a space to facilitate tasks and intuitive access to content
matthew weintrub trub
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // Sass (v3.3.4) | |
| // Compass (v1.0.0.alpha.18) | |
| // Stipe (v) | |
| // ---- | |
| @import "stipe/manifest"; | |
| %uppercase { | |
| text-decoration: uppercase; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <head> | |
| <title>BLOG</title></title> | |
| </head> | |
| <body> | |
| <section> | |
| <aside> | |
| <figure> | |
| <img src="http://placehold.it/350x150" alt="place" class="content-image"> | |
| <figcaption><a href="#">焨狨䛣姨谦 ズ㛥, 祧詞骧 チゆ 驌䣥儯ぴ堨</a></figcaption> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // Sass (v3.3.4) | |
| // Compass (v1.0.0.alpha.18) | |
| // ---- | |
| $grid-columns: 12; | |
| $visual-grid-breakpoints: null; | |
| $default-feature: min-width; | |
| @function new-breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ---- | |
| // Sass (v3.3.4) | |
| // Compass (v1.0.0.alpha.18) | |
| // Bourbon (v) | |
| // Neat (v) | |
| // ---- | |
| @import "bourbon/bourbon"; | |
| @import "neat/neat"; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="cards"> | |
| <div class="card"> | |
| <div class="ribbon-wrapper"><div class="ribbon">RIBBON</div></div> | |
| <div class="card-image"> | |
| <img src="https://raw.github.com/Magnus-G/Random/master/mountains-4.png" alt=""> | |
| </div> | |
| <div class="card-header"> | |
| PREMIUM | |
| </div> |
trub
/ the-ux-design-process.md
Last active
August 29, 2015 14:00
Introduction to the Process of a User Experience Product Designer
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body | |
| ul.menu | |
| li(title='home') | |
| a.home(href='#') home | |
| li(title='search') | |
| a.search(href='#') search | |
| li(title='pencil') | |
| a.pencil(href='#') pencil | |
| li(title='about') | |
| a.active.about(href='#') about |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link href='http://fonts.googleapis.com/css?family=Lusitana:400,700' rel='stylesheet' type='text/css'> | |
| <link href='http://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'> | |
| <link href='http://fonts.googleapis.com/css?family=Merriweather+Sans:400,300,300italic,400italic,700italic,700,800,800italic' rel='stylesheet' type='text/css'> | |
| <header class="navigation"> | |
| <div class="menu-wrapper"> | |
| <a href="javascript:void(0)" class="logo"> | |
| <img src="https://raw.github.com/Magnus-G/Random/master/placeholder_logo_1.png" alt=""> | |
| </a> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <link href='http://fonts.googleapis.com/css?family=Lusitana:400,700' rel='stylesheet' type='text/css'> | |
| <link href='http://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'> | |
| <link href='http://fonts.googleapis.com/css?family=Merriweather+Sans:400,300,300italic,400italic,700italic,700,800,800italic' rel='stylesheet' type='text/css'> | |
| <header class="navigation"> | |
| <div class="menu-wrapper"> | |
| <a href="javascript:void(0)" class="logo"> | |
| <img src="https://raw.github.com/Magnus-G/Random/master/placeholder_logo_1.png" alt=""> | |
| </a> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="grid-items"> | |
| <a href="javascript:void(0)" class="grid-item"> | |
| <img src="https://raw.github.com/Magnus-G/Random/master/placeholder_logo_1.png" alt=""> | |
| <h1>Grid Item</h1> | |
| <p>Lorem ipsum dolor sit amet, elit. Rem, illum.</p> | |
| </a> | |
| <a href="javascript:void(0)" class="grid-item grid-item-big grid-item-image"> | |
| <img src="https://raw.github.com/Magnus-G/Random/master/placeholder_logo_2.png" alt=""> | |
| <h1>Grid Item With an Image</h1> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem, illum.</p> |