OrgSync Connect 2014: Design Tips & Tricks
11 likes1,686 views
The document offers design tips for enhancing user experience in community-focused platforms, emphasizing minimalism in navigation and layout. It highlights the importance of branding, effective content creation, and the usability of forms, urging designers to prioritize clarity and accessibility. Best practices include using consistent formatting, maintaining left-aligned text, and being conversational in form design to improve user interaction.
OrgSync Connect 2014: Design Tips & Tricks
- 1. ORGSYNC CONNECT designTIPS & TRICKS 2014
- 2. YOUcan delight your users
- 3. The UI team wants to delight your users, too.
- 5. LESS MORE=
- 6. Navigation
- 7. Navigation
- 8. Navigation
- 9. Navigation
- 10. Navigation
- 11. Navigation
- 12. Navigation
- 13. Page Layout
- 14. BEST PRACTICE Less is more.
- 15. If youre not using modules in a portal, turn them o鍖. BEST PRACTICE
- 17. dont be AFRAIDof color
- 23. Community Logo and Pro鍖le Image
- 24. Community Logo and Pro鍖le Image
- 27. Community Logo and Pro鍖le Image
- 28. Branded Emails
- 29. Branded Emails
- 30. Branded Emails
- 33. or student design club might be able to help your graphics department
- 34. Logging In
- 35. Logging In
- 36. BEST PRACTICE Contact your campus consultant to set your campus colors or to change your primary logo.
- 37. Update your community pro鍖le picture in your community settings. BEST PRACTICE
- 38. Turn on branded emails (if desired) in your community settings. BEST PRACTICE
- 39. Brand o鍖cial school departments to help them stand out from student organizations. BEST PRACTICE
- 40. Link to your custom login page. BEST PRACTICE
- 45. Remember that youre creating content for multiple devices. BEST PRACTICE
- 46. Use formatting tools sparingly. BEST PRACTICE
- 47. Input text, not just images or links. BEST PRACTICE
- 49. Creating Content
- 50. Avoid underlining text for emphasis. Your readers will wonder why the link is broken.
- 52. You may want to use justi鍖ed 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, justi鍖ed text can look sloppier than left- aligned text.
- 53. 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.
- 57. Dont underline text unless its a link. Even then, its not necessary. BEST PRACTICE
- 58. Left-aligned text is usually best. BEST PRACTICE
- 59. Save the uppercase text for short subheads. BEST PRACTICE
- 60. Creating Content
- 61. Creating Content
- 63. GET EXCITED! Its time to 鍖ll out a form! Said no one ever.
- 64. FORMS SUCK. LUKE WROBLEWSKI Usability expert
- 65. LUKE WROBLEWSKI Usability expert If you don't believe me, try to 鍖nd people who like 鍖lling them in
- 66. LUKE WROBLEWSKI Usability expert 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....
- 67. LUKE WROBLEWSKI Usability expert FORMS JUST STAND IN OUR WAY.
- 68. Is the information NECESSARY? Keep Cut Postpone Explain
- 69. Be CONVERSATIONAL. Meeting Information Please include day(s), time(s), and location(s) of your meetings. When and where are your meetings held?
- 70. Keep question and answers CONSISTENT. Choose your preferred t-shirt color Blue Red What color hats do you want? Red Blue
- 71. Keep question and answers CONSISTENT. Choose your preferred t-shirt color Blue Red Choose your preferred hat color Blue Red
- 72. Provide POSITIONAL FEEDBACK. Page 1 of 3: Your Information
- 73. Provide POSITIONAL FEEDBACK. Page 2 of 3: Your Vehicle Information
- 74. Provide POSITIONAL FEEDBACK. Section 1 of 3: Event Details
- 75. Provide POSITIONAL FEEDBACK. Section 2 of 3: Catering Details
- 76. Use the right ELEMENTS. Checkboxes Radio Buttons Dropdowns
- 77. Use PAGE LOGIC when applicable. The best way to speed up form completion process is to not ask the question.
- 78. QUESTION EVERYTHING when moving a paper form online. The best way to speed up form completion process is to not ask the question.
- 79. Fill out your OWN FORM. OWN IT.
- 80. PEOPLE
- 81. RELATIONSHIPS
- 82. COMMUNICATION
- 83. NEWS POST demo
- 84. THANK YOU. Valarie Martin Stuart OrgSync UI Designer