RIT SIS Project Style Guide
description
Transcript of RIT SIS Project Style Guide
STRUCTURE
2
header header
footerfooter
main content
main content
main content
main contentsidebar
sidebar
navnav
Header : masthead, RIT logo, NavigationFooter : links Page content : Information, media
GRID SPACING12 column 960 grid
3
Items are left aligned with the outermost grid lines
Items extend to line up withthe outermost grid lineson the right as well
When it suits the design, itemsline up with grid lines
When design is more visually appealing this way, items do not line up with grid lines
1 2
3
4
1
2
3
4
TYPOGRAPHY
4
Used: calendar header, calendar days/times,-calendar class descriptions, class search infor-mation, saved courses descriptions, advisor information, upcoming date descriptions, grades courses, footer, tand navigation
Used: calendar class descriptions, side bar descriptions, grades courses, dates descriptions, calendar times
Used: calendar days, major title, saved courses names and numbers, nav items, advisor names
Used: calendar class names, BFA label, advisor names, grades term
Used: everything elsein opacities
Used: calendar daysand times
Cooper Hewitt Light 10 pt.
14 pt.
Used: all section headers22 pt.
Used: calendar month24 pt.
Used: welcome28 pt.
Used: all section headers, welcome, numbers in side bar, calendar toggle, advisor names, dates, grade letters
Cooper Hewitt Medium
Cooper Hewitt Semibold
Used: Nav bar
BUTTON EXAMPLES
5
Button NormalLato light 11pt.
Button HoverLato light 11pt.
Button ActiveLato light 11pt.