School Organization Rapid Prototyping Mockup + Mobile Mockup via Traditional Means

Design Design for Developers Tutorial
1

#School Organization Design Mockups In-the-browser and off.#
@kylefiedler: Hi Kyle, based on what was taught in the course and your feedback throughout the course, here’s another round of mockups.

##Rapid Prototyping Version
Using merely Chrome and Sublime to clean up things, I rapidly prototye
Note: Only the Last One Uses The Proper Serif Font, Adobe Caslon Pro for the body text

Image 1

Imgur

Image 2

Imgur

Image 3

Imgur

Image 4

Image 5

##Mobile
Deviant from my mobile-first approach, I did a ‘mobile’ version via InDesign

Will also upload once I figure out how to best do so in its current form to imgur.com

Don’t know why, while the image links are all valid, Thoughtbot’s Forum system will only show one iamge at a time

2

@kevinlozandier Can you show me this but without all of the borders? There are just so many of them that they create tension in the design and distract me from the content. Next I’d like to see all the titles bold instead of regular weight. to add to the hierarchy and contrast between the titles and body copy.

3

@kylefiedler: Here’s a version without the main border

Here’s a version with zero borders:

Imgur

Note: Again the link works above, but it seems I can only have one image shown each post with this current forum system and its Markdown implementation