RIB CCS
Website
Case Study
Homepage Walk-through
Who is RIB CCS
RIB CCS is a multi-national fit-for-purpose engineering and construction software solutions provider, serving over 40,000 clients in over 80 countries for over 40 years.
Small, medium and large businesses across the globe trust RIB CCS software to manage the entire engineering and construction project lifecycle. RIB CCS is an RIB Software SE company and a member of Schneider Electric.
The Challenge
RIB CCS conducted customer experience consulting workshops with Digitlab to improve processes, customer experiences, and lead generation pipelines on their website.
Digitlab had two departments working on the website development project: the website development team and the user experience and user interface (UX/UI) team.
Responsive Site Mockup
Custom Search Function Example
Technical Considerations
WordPress was used to host the website and we used Elementor for the website build.
Since users from over 80 countries would be accessing the website, a redirect function was implemented that would send internet users to region-specific website page based on their IP address.
A few more key functions we incorporated was a system where a user could input the requirements they had, and the website would present the best software solution for their specific needs. We also synchronised the Gravity Forms contact forms to the RIB CCS sales CRM system.
UI & Visual Elements
RIB CCS had a predetermined look and feel in terms of colour and branding which we utilised to create visual elements on the page as well as to create visual consistency.
Previously they focused on pixel based imagery, but the new site uses a blend of vector and pixel.
Button Example
Website Navigation
Colour co-ordinated product pages
The RIB CCS colour scheme had complimentary colours that we could tie in with the blue and grey base colours. These were used to differentiate the products from each other. For example, by using turquoise as the accent colour for Complete Solution, orange for Candy and yellow for Connect.
Custom SVG Animations
We made use of SVG animations which care lightweight, scalable animations using JSON files that integrated with in Elementor.
Some benefits of using SVG’s are:
- Lightweight animations that did not compromise website performance
- Scalable animations that could be easily integrated into the website
- Vector-based animations that contrasted with the site’s imagery, adding a unique and eye-catching element and more visual interest in page layouts
- SVG’s allow for the creation of custom animations that were unique to the brand and added personality to the site
- You can read more about SVG animations in WordPress design in our blog
Lottie Animation Examples