How we improved the E-learning experience for Makro HORECA Academy

CLIENT Siam Makro
PLATFORM Web Ecommerce
EXPERTISE Design and Development
CLIENT
PLATFORM
EXPERTISE
Siam Makro
Web Ecommerce
Design and Development
01
BRAND STORY

Siam Makro Public Company Limited launched Makro HoReCa Academy or “MHA” – an online-to-offline knowledge center - to support HoReCa professionals to increase their competitiveness in the digital age.


Users can register to stay updated on new business trends, free online courses, and engaging workshops. Makro HoReCa Academy Clinic is also available for anyone who requires a more in-depth knowledge in specific areas.

Get step-by-step advice Build the best experience

02
SCOPE OF WORK
Re-invision the legacy website based on MHA requirements. Enhance the structure and presentation of content, enhance usability, simplify functionality and make it more convenient to use. Launched in 2021, replacing the legacy web platform.
03
INFRASTRUCTURE
The web application for MHA is developed using Ruby on Rails and Javascript, replacing legacy WordPress code and plugins.

A mission-specific CMS system was developed entirely using Rails. All components of the containerized application are securely hosted on AWS.
04
DESIGN SYSTEM

Colors

Primary colors swatches developed from the original MHA brand. We choose a Lighter and Solid color for the CTAs

Typography

We researched fonts to respect the brand in both English and Thai language.

Illustrations

In addition to fonts and colors, illustrations were essential to effectively and easily communicate across languages.

Better communication through illustrations and icons

Make the components lively and prominant leveraging the shapes and colors of the icon set. Help the user to quickly understand the UI states.
05
USER INTERFACE

Welcome aboard

We have improved the homepage to be more user-friendly with clear delineation of section content. All of the new site’s banner content can now be managed directly from the CMS by any authorized content administrator.

Mobile friendly

70% of Users access the Makro Horeca Academy website via Mobile devices, so the design supports responsive web.

Learning anytime, anywhere

Knowledge Center is where HoReCa entrepreneurs can easily find industry insights and business advice. Users can study and monitor their progress.

Get step-by-step advice

Skill improvement

Additionally, users can challenge their skills by taking certification exams for each of their courses. Upon successful completion of each exam, users can download their certificate. Both desktop and mobile devices support this feature making it very convenient for users on the go.

Certificates

When users have completed the course and the exam, they can receive their certificate. It can be easily downloaded or retrieved from under their Account’s My Certificates page.

Stay up-to-date with Events

View various upcoming activities both online and offline. Makro members can register for the event for free via the website.

Keep your favourite recipe

Site localization in English and Thai are critical to successfully serving the local HORECA markets in Thailand. The native localization built into the platform will also make it easy to expand to additional language speakers in the future.

Easy Sign in

Users can sign in easily with the ID on Makro card or the mobile phone number used to register with Makro.

Create your free trial account

Even if a user is not currently a Makro member, they can create a trial account using a mobile phone number. To get access to Recipes, E-Magazines, and Articles, and all other free online content on MHA Website for 7 days.