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 you’re not using modules in a portal, turn them off. BEST PRACTICE
- 17. don’t be AFRAIDof color
- 23. Community Logo and Profile Image
- 24. Community Logo and Profile Image
- 27. Community Logo and Profile 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 profile picture in your community settings. BEST PRACTICE
- 38. Turn on branded emails (if desired) in your community settings. BEST PRACTICE
- 39. Brand official school departments to help them stand out from student organizations. BEST PRACTICE
- 40. Link to your custom login page. BEST PRACTICE
- 45. Remember that you’re 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 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.
- 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. Don’t underline text unless it’s a link. Even then, it’s 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! It’s time to fill 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 find people who like filling 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