Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Webinar: UI/UX best practices in cms based web design

2 916 vues

Publié le

Content management systems (CMS) make it super easy for you to manage the website content, its structure and design; thus saving your precious time and efforts, which you would rather focus to grow your business.

Furthermore, when the amazing looking design mock-ups are integrated into a CMS, it simply does not feel at par to provide the seamless experience across various devices, you aspired for.

UI/UX plays a critical role in your organization's success and has the capability to provide a significant and distinct competitive advantage when implemented in the right way. Harbinger Systems hosted an informative webinar on "UI/UX best practices in CMS based web design" on December 3rd, 2015. Attendees gained insights on various practices, processes and design strategies to create and deliver a rich and exceptional UI/UX for your CMS based website.

Publié dans : Technologie
  • Soyez le premier à commenter

Webinar: UI/UX best practices in cms based web design

  1. 1. UI/UX Best Practices in CMS Based Web Design
  2. 2. Housekeeping • Webinar recordings and slides will be shared with all attendees • Type in your questions and comments using the questions pane on the right hand side • “Special Offer” exclusively for the webinar attendees © Harbinger Systems | www.harbinger-systems.com
  3. 3. Presenters © Harbinger Systems | www.harbinger-systems.com Kirti Wagh Associate Design Manager Harbinger Systems Eshan Sarpotdar Digital Content Writer Harbinger Systems
  4. 4. Agenda • Content Management System • Importance of UI/UX in CMS based design • Standard Template method • Custom Template method • Best UI Practices – Standard Template & Custom Template • Recommendations • Special Offer • Q & A © Harbinger Systems | www.harbinger-systems.com
  5. 5. Content Management System A Content Management System is a simple and quick way to develop a website. © Harbinger Systems | www.harbinger-systems.com CMS Features • Quick development and deployment • Easy design capabilities • End-to-end site management • Easy for non-technical user to manage • Increased SEO performance • High-end engagement with online content
  6. 6. CMS Benefits Create Manage Implement Shared Resources Database Driven Branding Security & Approval Systems Mobile Ready Search Engine Friendly We can create new pages, sections, menus, media etc. Easy to edit, format content and manage the site Easy to implement ready code and template Consistent brand and standard navigation Change once, update entire website Access to modules, images, audio, video files etc. Different levels of access for approving content Templates are mobile compatible Optimizes your website for SEO compatibility © Harbinger Systems | www.harbinger-systems.com
  7. 7. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com
  8. 8. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com
  9. 9. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com
  10. 10. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com
  11. 11. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com Before After
  12. 12. Importance of UI/UX in CMS Design © Harbinger Systems | www.harbinger-systems.com • UI/UX is based on below parameters: • Demography • Features provided by CMS • Domain/Business • Scope of customization • UI/UX approach differs for various CMS • Two ways of design implementation: Standard Template Custom Template
  13. 13. Standard Template - Overview • Ready designs available • Follows the basic UI/UX guidelines • Templates available with HTML/CSS • CMS compatible • Easy to implement and manage • Template based sites may look alike © Harbinger Systems | www.harbinger-systems.com
  14. 14. Standard Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  15. 15. Standard Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  16. 16. Standard Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  17. 17. Standard Template - Process © Harbinger Systems | www.harbinger-systems.com Select Template Change branding and images Add pages, navigation& content Deploy the changes on server Website ready!!
  18. 18. Custom Template - Overview © Harbinger Systems | www.harbinger-systems.com • Liberty to create design • Add UI/UX value based on scope of customization • Knowledge of framework is required • The design should be easy to integrate • CSS plays a major role • We can achieve unique design • Consumes more efforts
  19. 19. Custom Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  20. 20. Custom Template - Example © Harbinger Systems | www.harbinger-systems.com
  21. 21. Custom Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  22. 22. Custom Template - Example © Harbinger Systems | www.harbinger-systems.com
  23. 23. Custom Template - Example © Harbinger Systems | www.harbinger-systems.com Before After
  24. 24. Create Custom Design Select default template Customize template Template Integration Add pages, navigation & content Deploy the changes on server Website ready!! Custom Template - Process As per framework compatibility Modify CSS & template © Harbinger Systems | www.harbinger-systems.com
  25. 25. Best Practices – Standard Template © Harbinger Systems | www.harbinger-systems.com Do not change the layout or structure of the template
  26. 26. Best Practices – Standard Template © Harbinger Systems | www.harbinger-systems.com We can change the branding of the template to match the client’s branding This change should be mainly in terms of colors and images
  27. 27. Best Practices – Standard Template © Harbinger Systems | www.harbinger-systems.com Once the branding is changed, we can add or edit content, images as per client requirement This is the quickest way to build a site or portal using CMS
  28. 28. Best Practices – Custom Template It is important that the designer is aware about the framework functionality before starting the design. © Harbinger Systems | www.harbinger-systems.com
  29. 29. Maintaining consistency in design is very important. Same section on different pages should look same. Best Practices – Custom Template © Harbinger Systems | www.harbinger-systems.com
  30. 30. Best Practices – Custom Template © Harbinger Systems | www.harbinger-systems.com
  31. 31. Customizing plug-in should be studied and developed such that it is easy to integrate and manage later Best Practices – Custom Template © Harbinger Systems | www.harbinger-systems.com
  32. 32. Recommendations – CMS Design Choose standard template approach when: • Less time – quick development • Minimum needs • Cost efficient Choose custom template approach when: • Looking for unique design • CMS facility • No major cost and time limitations
  33. 33. Recommendations – Startup ISV © Harbinger Systems | www.harbinger-systems.com Getting business started Simple and powerful design Cost efficient
  34. 34. Recommendations – Enterprise ISV © Harbinger Systems | www.harbinger-systems.com Achieve more business Achieve exceptional User Experience Cost is secondary
  35. 35. Special Offer for Webinar Attendees Get 1 Hour Free Consultation from our UI UX Experts Discuss your UI & UX Challenges Write to us at hsinfo@harbingergroup.com to avail your offer.
  36. 36. © Harbinger Systems | www.harbinger-systems.com
  37. 37. Special Offer for Webinar Attendees Get 1 Hour Free Consultation from our UI UX Experts Discuss your UI & UX Challenges Write to us at hsinfo@harbingergroup.com to avail your offer.
  38. 38. Thank You! Visit us at: www.harbinger-systems.com Write to us at: hsinfo@harbingergroup.com Blog: blog.harbinger-systems.com Twitter: twitter.com/HarbingerSys (@HarbingerSys) Slideshare: slideshare.net/hsplmkting Facebook: facebook.com/harbingersys LinkedIn: linkedin.com/company/382306 © Harbinger Systems | www.harbinger-systems.com

×