Design Portals
LIKE A ROCKSTAR
Valarie Martin Stuart
UI DESIGNER / ORGSYNC, INC
BE YOUR AUDIENCE
USE OF COLOR
DON’T BE AFRAID OF COLOR
USE YOUR POWER WISELY
just because you
CAN
doesn’t mean you
SHOULD
DESIGN TEXTwith
Avoid underlining text for emphasis.
Your readers will wonder
why the link is broken.
You may want to use
justified text because it
s e e m s “ t i d i e r . ” T h e
downside on the web is
that you cannot cont...
Left-aligned text is better.
It maintains word and letter
spacing, and provides clues
on where the next line starts.
It is...
just because you
CAN
doesn’t mean you
SHOULD
we read shapes
just because you
CAN
doesn’t mean you
SHOULD
BEST PRACTICE:
Follow your school’s
brand standards for color.
Secondary palettes may be desirable.
BEST PRACTICE:
Save the uppercase text
for short subheads.
BEST PRACTICE:
Left-aligned text is
usually best for web pages.
If you choose another alignment option,
have a good reason.
BEST PRACTICE:
Don’t underline text unless
your text is a link.
And even then, you don’t have to.
FORMS
This is Luke Wroblewski.
LukeW knows forms.
And according to LukeW...
FORMS SUCK.
“
“
If you don't believe me, try to find
people who like filling them in. You
may turn up an accountant who gets
a rush when wra...
But for most of us, forms are just
an annoyance. What we want to do
is to vote, apply for a job, buy a book
online, join a...
FORMS JUST
STAND IN OUR WAY.
“
“
you need to collect
DATA
people don’t like
FORMS
Is the information necessary?
Really, really necessary?
Is the information necessary?
Keep questions consistent.
Keep questions consistent.
Answers, too.
Provide positional feedback.
That’s the fancy way to say
PAGE 1 OF 3.
YOUR OWN FORM
Complete
BEST PRACTICE:
Be consistent.
Will you make forms less painful?
Yes
No
BEST PRACTICE:
Ask only what’s necessary.
Will you use the information you’re
gathering? Seriously, will you?
BEST PRACTICE:
Use helpful page titles.
Positional feedback lets students know
how much pain is left.
LET’S BUILD CONTENT
now that we’re designers...
YOU LOOK MARVELOUS
best practices
or student design club
might be able to help
your graphics department
PLEASE YOUR AUDIENCE
http://www.flickr.com/photos/noahbulgaria/199834532/
http://www.flickr.com/photos/73207064@N00/404319562/
http://www.flickr.c...
thank you
ROCK YOUR PORTALS
Valarie Martin Stuart
valarie@orgsync.com
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Design Portals Like a Rockstar
Upcoming SlideShare
Loading in …5
×

Design Portals Like a Rockstar

3,426 views

Published on

Presentation on June 29, 2013, at OrgSync Connect, the second annual user conference for OrgSync campus partners.

Published in: Technology, Design
1 Comment
12 Likes
Statistics
Notes
No Downloads
Views
Total views
3,426
On SlideShare
0
From Embeds
0
Number of Embeds
165
Actions
Shares
0
Downloads
0
Comments
1
Likes
12
Embeds 0
No embeds

No notes for slide

Design Portals Like a Rockstar

  1. Design Portals LIKE A ROCKSTAR Valarie Martin Stuart UI DESIGNER / ORGSYNC, INC
  2. BE YOUR AUDIENCE
  3. USE OF COLOR
  4. DON’T BE AFRAID OF COLOR
  5. USE YOUR POWER WISELY
  6. just because you CAN doesn’t mean you SHOULD
  7. DESIGN TEXTwith
  8. Avoid underlining text for emphasis. Your readers will wonder why the link is broken.
  9. You may want to use justified text because it s e e m s “ t i d i e r . ” T h e downside on the web is that you cannot control your word or letter spacing. As a result, justified text can look sloppier than left- aligned text.
  10. Left-aligned text is better. It maintains word and letter spacing, and provides clues on where the next line starts. It is also considered more accessible.
  11. just because you CAN doesn’t mean you SHOULD
  12. we read shapes
  13. just because you CAN doesn’t mean you SHOULD
  14. BEST PRACTICE: Follow your school’s brand standards for color. Secondary palettes may be desirable.
  15. BEST PRACTICE: Save the uppercase text for short subheads.
  16. BEST PRACTICE: Left-aligned text is usually best for web pages. If you choose another alignment option, have a good reason.
  17. BEST PRACTICE: Don’t underline text unless your text is a link. And even then, you don’t have to.
  18. FORMS
  19. This is Luke Wroblewski.
  20. LukeW knows forms. And according to LukeW...
  21. FORMS SUCK. “ “
  22. If you don't believe me, try to find people who like filling them in. You may turn up an accountant who gets a rush when wrapping up a client's tax return or perhaps a desk clerk who loves to tidy up office payroll. “ “
  23. But for most of us, forms are just an annoyance. What we want to do is to vote, apply for a job, buy a book online, join a group.... “ “
  24. FORMS JUST STAND IN OUR WAY. “ “
  25. you need to collect DATA people don’t like FORMS
  26. Is the information necessary?
  27. Really, really necessary? Is the information necessary?
  28. Keep questions consistent.
  29. Keep questions consistent. Answers, too.
  30. Provide positional feedback. That’s the fancy way to say PAGE 1 OF 3.
  31. YOUR OWN FORM Complete
  32. BEST PRACTICE: Be consistent. Will you make forms less painful? Yes No
  33. BEST PRACTICE: Ask only what’s necessary. Will you use the information you’re gathering? Seriously, will you?
  34. BEST PRACTICE: Use helpful page titles. Positional feedback lets students know how much pain is left.
  35. LET’S BUILD CONTENT now that we’re designers...
  36. YOU LOOK MARVELOUS best practices
  37. or student design club might be able to help your graphics department
  38. PLEASE YOUR AUDIENCE
  39. http://www.flickr.com/photos/noahbulgaria/199834532/ http://www.flickr.com/photos/73207064@N00/404319562/ http://www.flickr.com/photos/melaniehumble/7218718724/ http://www.flickr.com/photos/53068636@N00/3920363262/ http://www.flickr.com/photos/88209423@N00/4280435876 Other images purchased and licensed from iStockPhoto and Fotolia. PHOTO CREDITS
  40. thank you ROCK YOUR PORTALS Valarie Martin Stuart valarie@orgsync.com

×