Mechanics Hub is the largest recruiting company for diesel mechanics and heavy equipment technicians in North America.
But that's the short description of their activity. If we were to detail upon it, we would say that Mechanics Hub is:
- the leading online resource in USA and Canada for Diesel machinery professionals (mechanics, technicians, parts/service staff and shop managers...) seeking jobs
- a content-heavy, one-stop resource updated regularly with industry news, videos, tips, training resources
- the most popular Diesel forum community
- the go-to resource for employers looking to hire exclusively highly qualified technicians and/or skilled Diesel professionals
Now, we can all but agree that such a high trafficked website (i.e. the forum only has +10.000 active members) must provide the best user experience. Whether its visitors access it to look for job opportunities, to read the latest industry news or to hire qualified Diesel mechanics.
But user experience was precisely the aspect where, well, things could be better. And that's when we stepped in to... save the day.
To revamp the UI/UX design completely ...
And we knew that this was a major dare considering that:
- we were dealing with a content-heavy website: the Mechanics Hub Toolbox alone included various content-packed subsections like the forum itself, articles, trade resources, tips & tricks, entertainment content, and the list goes on
- the content diversity there was just ... overwhelming: pictures, articles, videos ... crosswords
- that heavy (and complex) content infrastructure needed to be easy to access and to sift through on all devices
In a nutshell, the 3 main goals for this project were:
- to design a new user interface that should be cleaner, simpler, one that would enhance a smooth interaction
- to better structure all that content on the Mechanics Hub site, making it more intuitive for users to just flow through
- to create a cleaner and more modern website design that should better reflect the Mechanics Hub brand identity
Migrated the Website from Wordpress to Drupal
And this called for a complex, multi-step process, where we implemented content and assets migration from one platform to the other.
Simplified the Content Structure
We knew that reorganizing the content architecture so that it should be simpler and easier to follow was crucial if we wanted to improve the user experience on the website.
And this was definitely no easy task, but we managed to come up with a more solid, more logical structure for this content-rich website.
One that ensures a simplified, more intuitive navigation for its visitors.
Redesigned the MechanicsHub Website
And here we played with color contrasts: black and yellow.
Black was already the dominant color on the existing site and we added splashes of bright yellow, the same hue that you can find in their logo, to:
- reinforce their brand identity aesthetically
- draw attention to specific pieces of content on the website, leveraging this powerful contrast, and better guide the visitors to the key sections there
Overall, besides this strategic use of color contrast, our team strived to give the site's old design a cleaner, simpler look. To bring it up to date with the latest web standards.
Implemented Responsive Web Design
Again, ensuring that this heavy (and heavily diversified) content ecosystem was easy to navigate no matter the screen size, was a real "struggle" for our web designers.
Yet, we managed to make the content interface easy to navigate and user-friendly on all devices.
Mechanics Hub has gone from a clunky, overly cluttered and somehow too distracting WordPress site, to a:
- neatly and logically structured
... Drupal website with a simplified and more intuitive navigation and cleaner design.
Equal Opportunity Community Initiative (EOCI) is an international nonprofit that offers education-based programming to children in underserved communities.
Their efforts could be summed up in one sentence: Granting all children equal access to education.
"Creating a world where every child has the opportunity to succeed" (Equalopp.org)
It's a community of 5000 volunteers and donors that:
- provides children at-risk with easy access to the organization's educational spaces and resources
- makes sure that these vulnerable kids and youth's essential life needs are addressed
- provides youth in poverty with the proper training programs to help them gain the competencies needed in a work environment
- encourages the young people in those underserved communities to get involved, to seize all volunteering opportunities and... take action
"We owe it to ourselves as much as to these children to work with determination and passion to eradicate poverty, provide education and improve everyone’s living conditions." (Equalopp.org)
The opportunity to use our experience in Drupal development and our expertise in UI/UX design for contributing to this "community of world changers" was just so... compelling for us.
To turn a 10-year old website, built on Joomla (a quite old version of Joomla), with low traffic and a low conversion rate, into a:
- highly engaging
... Drupal 8 website.
“Our website was outdated and lacked traffic as well as conversions. It was built in 2010 and wasn’t up to date with our new programs. As a nonprofit, it’s not easy to communicate your story and mission in the timeframe when someone’s on your website. Our old website wasn’t telling our story because we’d expanded in many ways. We needed a product that was mobile-friendly, capture the user, and convert them to take action.” - Sean Kelly, Executive Director, Equal Opportunity Community Initiative
One that would provide a better content experience to its visitors — future volunteers and donors.
And for that, the entire information architecture had to be reconsidered, the site navigation optimized and a new UX design created.
In a nutshell: we had to build a Drupal 8 website, from the ground up.
One that would:
- tell their story and communicate their mission to a larger group of potential "life-changers"
- make it easier for its visitors to find, navigate through content and engage with it
Furthermore, EOCI needed us to implement a newsletter functionality into their redesigned website. And to create a mobile version, as well.
A user-friendly page layout
We soon realized that the key to turning an outdated Joomla website into a site that draws and hooks visitors in is... simplicity.
A simplified, clear and easy to navigate through page layout was the solution.
And so, we knew then that the Paragraphs module was the perfect tool for this project goal. It helped us break down the content into multiple reusable components.
Then, assemble a neat page layout, with clearly defined sections.
Moreover, the module helped us grant the best content experience to the end-users and the best editorial experience, as well. We knew that we would empower EOCI's editors to easily put together future page layouts of their own.
An intuitive information architecture
A rock-solid, clear website structure was crucial if we expected it to tell the organization's story with an impact.
Therefore, we changed the way the information was organized across the website. And we implemented a more intuitive navigation structure and clear conversion paths. Website visitors can now find the information that makes the EOCI's story, engage with it and... convert quicker.
"The company that manages our Google Ads has found that our conversions have increased. The traffic has remained the same, but the amount of time users spend on the website and the number of actions taken has gone up about ten-fold. That’s what we set out to do exactly. We’re seeing an ROI in a short amount of time: That’s a success for us completely." - Sean Kelly, Executive Director, Equal Opportunity Community Initiative
A new custom theme
The organization wanted their new website to be as visually-pleasing as... fast.
The new Drupal 8 website had to entice users, visually, before it could engage them. So, we created a new theme to help EOCI communicate their mission and their vision in a more compelling way.
"A couple of our donors are thrilled with the website and have committed their support again. They’re happy to be on the partners' page with a fresh look and approach to the public." - Sean Kelly, Executive Director, Equal Opportunity Community Initiative
A high-speed Drupal 8 website
Since one of the top goals of the project was to increase conversions, fast-loading pages were a critical factor for meeting that goal.
Thus, we've had the top performance in our minds throughout the development process.
We used an "Optimize for top speed" approach as a criterion to filter through all the decisions that we made while building their new Drupal 8 website.
A mobile version of the website
EOCI wanted to communicate their story to as many people as possible. So the need to appeal to potential "life changers" on their mobile devices became critical.
And that's what we did. We came up with a visually-pleasing, easy to use the mobile version of the EOCI website.
One that boosts the organization's efforts and brings its message to mobile users, as well.
To maximize its exposure, the organization needed to implement a newsletter functionality. And... we complied with their request, using the Simplenews module for this.
"The site’s beautiful and performing exactly how we’d hoped it would." - Sean Kelly, Executive Director, Equal Opportunity Community Initiative
A Drupal 8 website that's fast, visually appealing and easy to use.
We managed to turn the old Joomla website into the most effective "messenger" of the EOCI's story and mission.
A welcoming service point for all potential donors and new volunteers.
Just imagine: THE most prestigious awards in the world, in the field of human rights, and us being granted the honour to give the corresponding website a performance boost!
And a traffic boost, as well, by improving the user experience provided there, making it easily accessible for visitors all over the globe. We won't lie to you: the honour was directly proportional to the overwhelming responsibility that we came along.
Besides the project's main goal — to optimize the website's overall performance — our client approached us with 2 special requests:
- to implement a new translation system that would enable them to reach a global audience and enter new markets
- to migrate the May-November 2019 content for the Photography Competition section on the website
The last project requirement did pose a challenge since the content to be migrated had lots of in-text references.
- we updated the existing allardprize.org website to the latest version of Drupal 7
- we performed all the necessary updates to Drupal core, to the contributed and custom modules, part of the user interface and the existing set of features
- we ran the latest security patches, as well
- we enabled the GTranslate module and thus implemented the translation feature that our client requested
- we migrated the specified content and found a way of processing the data within the given Pantheon hosting plan
- we conducted an in-depth performance audit on the website and we identified areas of improvement
- we did some Drupal performance optimization work, taking a series of necessary measures to speed up the website's page load and reliability/blog/boost-drupal-performance
The result: the Allard Prize for International Integrity website now runs significantly faster and provides a seamless user experience to its visitors, irrespective of their geographical location.
An online meeting place for EHS and quality professionals, where they can connect, collaborate and share gained knowledge with their peers. Members get to ask questions to leading industry experts and to access highly diversified curated content ranging from infographics to market research to news, to whitepapers and webinars...
The community platform was already an authority in its niche, attracting more and more members. Also, Intelex was constantly looking to improve the user experience provided there, but there was still room for improvement.
And this is when they came to us to help them reach their most recent goals:
to improve the page load time
to optimize the membership system and to set up several different groups
Small user communities would then grow around these new groups, with group-specific content to be shared and “consumed” there…
we worked towards improving the cache mechanism for higher page load speed
we added 2 new different sections: “Companies” and “Groups”
we integrated specific legacy platforms into the Drupal 7-based membership website: Pardot, SalesForce, ServiceNow
we connected the Intelex Community website with Axure Data Hub; now every time that a piece of content gets added, removed, or edited on Drupal, it automatically synchronizes on Axure Data Hub, as well, via a custom-built REST Endpoint
we integrated it with Custom Windows Azure API, as well, thus turning Drupal into a centralized system
we simplified and streamlined the whole content workflow
we better structured the existing membership system, organizing both members and content into multiple different groups
Our client needed a new service landing page and content page for the official website of the city of Hamilton, Ontario. In this respect, the plan included enhancing the existing template, to better support their marketing capabilities, and improving the current theme, as well.
As for the “new” functionalities to be implemented, many of them were due to be “old” features repurposed.
And so, they selected us to develop and theme the new pages.
built and themed a new landing page listing all the departments (Cemeteries, Museums, etc.)
… one which overlaps the existing main header and “lives” within the same environment
provided a new page layout, with department-specific branding
ensured that the editorial staff could easily update the theme sections
cross-developed the new landing page for Drupal 8
provided a mobile version, as well, where the editor(s) could easily switch between the 2 versions of the menu color
implemented a functionality enabling the user to swap out, according to the specific department branding
implemented a functionality that would collapse the main header on Hamilton.ca and trigger a brand new page layout, along with the department-specific branding
enabled the editorial team to include up to 5 department-specific items overlapping the main header
set up and themed a new content page carrying the same features as the current basic one on the website, but without the side menus
The result: a more user-friendly, visually-appealing alternative to the current website of the city of Hamilton, one that better highlights the services provided there (culture, recreation, museums, etc.)