Kokonatt Indonesia is a company specializing in producing and exporting coconut and its derivative products. They focus on delivering high-quality, eco-friendly products such as coconut charcoal, premium coconut oil, and brisket kelapa (coconut-based briquettes) for industries including energy, agriculture, and consumer goods. Their commitment to sustainability and local empowerment positions them as a trusted partner for global clients seeking renewable and high-value coconut products brisket
The Goal for Kokonatt Indonesia’s Website
Create Brand Awareness: Position Kokonatt Indonesia as a leader in coconut and derivative products by providing a central hub for information about their business, products, and global impact.
Build a Strong Online Presence: Present a professional image as a trusted supplier in the coconut industry. The site functions as a virtual showcase of their product range, sustainability initiatives, and commitment to quality.
Highlight Product Features: Provide detailed specifications for coconut-based products like charcoal, oil, and briquettes, tailored to the needs of both industry and consumers.
Support Marketing Strategies: Incorporate storytelling, customer-centric design, and engaging content to attract global clients and business partners.
User Targets
The website serves as Kokonatt Indonesia’s first comprehensive online platform, with the following objectives:
Industrial Buyers: Companies looking for coconut-based raw materials.
Export Partners: Businesses seeking reliable suppliers for international trade.
Sustainability Advocates: Clients prioritize eco-friendly and renewable resources.
Scope
This is Kokonatt Indonesia’s first website, so I created it entirely. I carefully designed each page's layout, visual elements, and structure to reflect the brand's identity and goals. The website includes the following pages:
Home: A central hub introducing Kokonatt Indonesia’s mission and services.
About Us: Highlighting the company's background, vision, and commitment to sustainability.
Products: Showcasing their diverse range of coconut-based products and derivatives.
Values: Demonstrating the company’s core principles and ethical approach to business.
Production: Providing insights into their manufacturing processes and quality standards.
Testimonials: Featuring client and partner feedback to build trust and credibility.
Blog: Sharing industry insights, updates, and educational content related to their products.
My Role and Responsibility
As the UI Designer, I contributed to the design and development of this platform by:
Initial Consultation and Requirements Gathering
We Collaborated directly with the founder of Kokonatt Indonesia to understand the business goals and design expectations for the website.
Responsiveness and Accessibility
Design responsive pages for desktop and mobile to provide an optimal experience for users on various devices.
Iterative Process
Collected feedback from the client and refined the design until it met expectations.
Coverage
I discussed with the owners online to understand their vision, desired outcome, and aesthetic. They wanted a simple and modern design with limited use of colors, in line with their brand identity. Most importantly, the look of the site should reflect the essence of their main product, which is coconut and its various preparations.
Website Design Inspiration
These are some of the sites favored by clients.
Sitemap
Although this is a simple website, I decided to create a site map to ensure clarity and alignment with stakeholders. Even for smaller projects like this, having a sitemap provides a shared understanding of the website structure and helps maintain focus during development. Analytics with Predict and watch your platform thrive.
Challenge
Working on an export web design project for Kokonatt Indonesia had its challenges. One of the main hurdles was striking the perfect balance between simplicity and modern aesthetics while ensuring the design stayed true to the brand identity. Creating a clean layout that reflected the essence of their coconut-based products without overwhelming the user was a meticulous process. Another challenge was translating the stakeholders' vision into a functional and visually appealing design.
Despite these struggles, the process was a valuable learning experience and an opportunity to deliver a customized solution that matched the client's expectations.
Mockup
Right after I understood the guide's design elements and color palette, I immediately started working on the mockup. Here is the initial design for the homepage.
Hero Section Design
Kokonatt Indonesia's website design is designed to reflect the professionalism, sustainability, and excellence of coconut-based products. With an immersive tropical background, the design highlights the brand's natural identity. Green and white colors are used to convey freshness and professionalism, while simple navigation and Call-to-Action buttons are strategically placed for easy user interaction.
Key sections such as products, testimonials, and blogs are prominently displayed to build trust and provide education. Statistics and icons reinforce credibility, while high-quality images highlight product visuals. The minimalist structure ensures users have an intuitive and engaging experience without losing focus on the company's core values.
