User-Centered Website Design
Download as PPTX, PDF0 likes423 views
The document discusses strategies and tools for improving digital marketing effectiveness, emphasizing the importance of aligning business goals with communication and user experience. It highlights key statistics on user attraction and conversion, offers tips for content management, and recommends various wireframing and design tools for website development. Additionally, it underscores the significance of a mobile-first approach and responsive design in creating successful digital platforms.
User-Centered Website Design
- 1. From Awful to Awesome Tips and Tools to Attract, Convert and Delight Users getlevelten.com i j k l m
- 2. Highly integrated, interactive & flexible Marketing Website Content/User Management Knowledge Base Extra / Intranets Newsletters SEO Digital / Process Management Document Management Web Services Landing Pages Analytics / Reporting CRM Product One-sheets Content Delivery Networks Automated Marketing Systems Press Room User Permissions Blog Wiki Forum Contracts Workflow Multiple Languages Video Tutorials Application/Spec Guides Mobile Apps
- 3. Houston, we have a problem. Chaos Report by The Standish Group: Application Delivery Average cost overrun: 45% Time overrun: 63% Functionality delivered on average: 67%
- 4. Why do projects fail? Inability to communicate. We are asked to estimate things that are intangible. We make the most important decisions when we know the least about the product we are creating. Business models/requirements change often which changes the scope of work.
- 5. Waterfall vs. Agile Requirements Design Implementation Verification Strategy Requirements Design Implementation Verification 2 week cycles Waterfall Agile
- 6. Start by understanding your business goals.
- 7. What is your overall marketing strategy?
- 8. What are your sales goals?
- 9. How many leads do you need to hit your sales goals?
- 10. What are your top 3 initiatives for quarter/year?
- 11. What competition do you face?
- 12. Why is your website important for your business?
- 13. Do you feel like you get enough visitors to your website?
- 14. Are you happy with the rate your website converts visitors into leads?
- 15. Focusing on business goals changes the way we communicate with decision makers.
- 16. Discovery
- 17. VAR Step 1: Identify Users & Goals 5 Content Contrib utor Current Customer Prospect
- 18. 5 Step 2: User Needs As a prospect, I would like better understand how Company Name’s products/services will improve my life.
- 19. 5 Step 2: User Needs As a prospect, I would like the ability to share what I learn with my co-workers.
- 20. 5 Step 2: User Needs As a prospect, I would like the ability to download white papers to learn more about your technology.
- 21. 5 Step 2: User Needs As a prospect, I would like access to your learning section so that I can familiarize myself with your technology.
- 22. 5 Step 2: User Needs As a VAR, I would like the ability to download sales and marketing material so that I can sell more products.
- 23. Step 2: User Needs 5 As the marketing manager of the site, I would like the ability to run reports to see how many leads were generated last month.
- 24. Attract. Convert. Improve. Delight.
- 25. Attraction Stats 79% of links users click on are organic, not paid. Companies that blog have 97% more inbound links Auto-posting to Facebook decreases likes and comments by 70% 80% of Pinterest users are female 57% of TV viewers use the web simultaneously
- 26. Conversion Stats & Tips CTAs promoting ebooks get almost twice the click-through-rate as emails promoting webinars Companies with 30+ landing pages generate 7x more leads than those fewer than 10 CTAs in contrasting colors to the website generate more clicks Use matching action verbs on headlines and buttons are more effective than using different words
- 27. Mobile First Mentality 1024 x 768 320 x 480
- 30. Wireframes Show the structure of the website Custom user paths Most important user interface elements, their position and relationships between website pages
- 31. Wireframe Software OmniGraffle Favorite of Mac community Originally designed as a diagram tool Wide range of stencils
- 32. Wireframe Software Balsamiq Mockups For people who want a quick and dirty layout Built on Adobe AIR Provides a variety of hand-drawn pre-built objects
- 33. Wireframe Software Axure RP Available for both Mac & PC Boasts a client list that encompasses most successful companies around Very flexible with many widgets, libraries and master document
- 34. Wireframes: Things to Consider Desktop Mobile Focus on achieving business goals. Always keep the end-user in mind. As a developer, always, always be involved in the process. Think “mobile first” and create accordingly.
- 35. Mood Boards Represent a mood, atmosphere or feeling as a way to research ideas for future comps that will be created. Sets creative expectations Gives designers better direction for comps Saves time an money
- 36. Mood Board: Things to Consider Does the chosen typography compliment the brand and can it be translated to the web interface? Can selected patterns and/or textures be tiled to reduce the overall file size of the site? Can image ratios be re-sized appropriately, and can they be easily managed by less technical clients? Are the standard image sizes (4:3/16:9) or will they require cropping?
- 37. Comps Static look and feel of the final website. Sets creative direction Clients get excited – like opening a present
- 38. Design Considerations Design for mobile first Think about using circular buttons rather than squares and make large touch-points Think about how responsive design works and design site accordingly Don’t over design. Keep it clean and simple Use images that work well for mobile – no embedded text within images
- 39. Theme Integration Responsive is a must Twitter’s Bootstrap is LevelTen’s preferred framework Choose a solution that matches your needs, is easy to work with and can accomplish your goals Choose a lightweight system that compresses/minifies code
- 41. Development Use a system that provides support through a popular community and can be extended: CMS: Drupal, WordPress, Joomla, Ektron, Sitecore Open-source is always nice Good API for integration is a must A good CMS saves a tremendous amount of $$$
- 42. Thank You! brentb@getlevelten.com Twitter: @brentbice LinkedIn: linkedin.com/in/brentbice