IOI Oleochemical
Making oleochemicals easy to source.
IOI Oleochemical, a division of IOI Group, supplies fatty acids, glycerine, soap noodles, fatty esters and specialty derivatives to multinational manufacturers in more than 80 countries. Their 15-year-old website no longer reflected that scale. Our goal was a modern, mobile-first site with a personality of its own, while staying recognisably part of the IOI family.
- Balanced Brand Identity: Built a web styleguide that takes about 30% from IOI Group's guidelines and 70% from a fresh IOI Oleochemical identity, anchored in IOI's signature blues.
- Web-First Typography: Replaced hard-to-read serif type with a clean, readable type system and WCAG-conscious colour contrast.
- Mega Menu Navigation: Restructured the sitemap so every product range and subpage is reachable at a glance.
- Two Ways to Browse Products: Buyers can explore the catalogue by Application (the industry problem they are solving) or by Trademark Family (the IOI brands they already know).
- Mobile as a Priority: Every layout was designed so the mobile experience is as strong as desktop, from browsing products to sending an enquiry.
We ran a seven-week engagement with clear approval gates at strategy, design, staging and launch, working against a hard deadline.
- Strategy & Discovery: Mapped key journeys for B2B buyers, partners and corporate visitors, audited existing content and locked the sitemap before any design work.
- Styleguide & UI Design: Defined the visual system first, then moved from low-fidelity wireframes to high-fidelity desktop and mobile screens with interactive Figma prototypes for review.
- UX Copywriting: Refined the English content for scanning and SEO, with Mandarin localisation planned as a follow-up phase.
- Webflow Build, Exported: Designed and developed in Webflow, then exported the production code for IOI's in-house IT team to host on their own infrastructure.
- Headless CMS: Products, trademark families, applications, events, careers and PDFs are managed in a headless CMS, so the IOI team can update content without touching code.
- Smart Enquiry Routing: Enquiries are categorised by type and routed straight to the right IOI team, with reCAPTCHA v3 filtering spam.
- Handover & Support: Delivered a structured handover session for IOI's marketing and IT teams, covering CMS, analytics and forms, backed by one year of technical support.
From D+ to B− Overall SEO Grade
The previous site scored D+ on SEOptimer. The new build lifted the overall grade to B−, built on fundamentals that the old platform couldn't support.
A-Grade On-Page SEO
Optimised title and meta lengths, a clean H1–H3 hierarchy, canonical tags, an XML sitemap and JSON-LD structured data earned the site an A for on-page SEO, so search engines can read exactly what IOI Oleochemical offers.
Ready for AI Search
With an llms.txt file, Organization schema and full access for AI crawlers, the site scored B+ for Generative Engine Optimisation, putting IOI in position to show up in ChatGPT, Gemini and other AI-powered answers.
Zero Layout Shift, Instant Response
A Cumulative Layout Shift of 0.00 and an Interaction to Next Paint of 94ms sit well inside Google's "good" thresholds, so pages stay stable as they load and react the moment a buyer taps.
Built for a Global Audience
Hreflang tags, locale-ready URLs and an EN/中 language switch lay the groundwork for IOI's buyers in more than 80 countries to find the site in their own language.
