Take your Communities to the next level - Fabio Gervasoni, HCL

Let'sConnect Connects Virtual March 2021

Connections 7 offers new ways of tweaking and customizing the homepage layout of your community and new capabilities made possible by new Connections templates. In this session, Fabio Gervasoni, head of the HCL Connections Design team, will share design tips and best practices on developing Communities that are suited to your needs, attractive and engaging for your specific audiences.

Transcript

1. Take your Communities
   to the next level
   Fabio Gervasoni
   Lead UX/UI Designer | HCL Digital Solutions
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   March 16, 2021
   

   View Slide

2. Content
   • Web design - basic principles
   
   • Demo/widgets examples
   
   • Resources
   
   • Questions
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   

   View Slide

3. Basic principles of web design
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   1 2
   Consistency Simplicity
   

   View Slide

4. 1. Consistency
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   Typography
   Colour
   Aa
   Layout
   • Avoid a cluttered layout
   
   • Avoid using too many colours
   
   • Chose colour pairing carefully
   serif sans serif
   • Avoid using too many fonts/font sizes
   
   • Ensure readability
   
   • Watch for symmetry /alignments
   

   View Slide

5. 2. Simplicity
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   Easy to scan page
   1
   2
   3
   Visual hierarchy
   • Highlight important elements (size/colour)
   
   • Choose suitable layout grid for content
   
   • Use images with purpose
   • Avoid ’wall of text’ paragraphs
   
   • Use headers, bullet points
   
   • Watch line length (45 to 75 characters)
   Contrast
   You will read
   this first
   And you will read this
   Then this one
   And you will read this last
   

   View Slide

6. Demo
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   

   View Slide

7. Free resources
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   Stock images
   https://pixlr.com/
   https://www.pexels.com/
   Image editor
   Colour palettes https://color.adobe.com/create/color-wheel
   

   View Slide

8. Questions?
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   

   View Slide

9. Thank you!
   Fabio Gervasoni
   fabio.gervasoni@hcl.com
   Copyright © 2021 HCL Technologies Limited | www.hcltech.com
   

   View Slide

10. $10 BILLION ENTERPRISE | 159,000+ IDEAPRENEURS | 50 COUNTRIES
    WATCH THE FILM
    

    View Slide