Wisesight
Kirin AI engine landing page
Focusing on enhancing user experience through detailed feature descriptions and interactive demos for users to explore.

Role
WordPress design
Visual design
Tools
Figma
WordPress (Gutenberg)
CSS
Teams
1 product owner
1 developer
1 content writer
Timeline
June 2023
Overview
Kirin is an advanced AI engine developed by Wisesight, the social media analytics service in Thailand. Kirin offer API for tasks like analyze images, recognize text, understand sentiment, and more.
The current website was designed to demonstrate Wisesight’s AI engine for social media data analysis, but it did not originally plan to offer the API itself. Therefore, the redesign aims to update the website to reflect Wisesight’s new goal of providing the Kirin API to clients. This involves reimagining the website to clearly communicate the features of the API, ensuring potential users understand its benefits and how they can utilize it for their own projects.
Design Approach
The new design of the Kirin website goals is to help visitors easily understand the value and functionality of Kirin’s features by using clear explanations and attractive illustration to make complex ideas simple to grasp. Additionally, we provide interactive demos so users can try out Kirin themselves and get a better sense of how it can be used.
In addition, to ensures that the website effectively communicates the value of Kirin to different users, we have added a section that shows how Kirin can benefit people in different roles, such as marketers, developers, and product owners.
Information Architecture
Kirin has several features like object detection, optical character recognition (OCR), logo recognition, scene recognition, not safe for work (NSFW), sentiment analysis, named entity recognition (NER) and more to come in the future. To make it easier for users, we organized these features into two categories: Computer Vision and Natural Language Processing. This helps users navigate the information without feeling overwhelmed and allows them to quickly find the features they need.
Computer Vision
- Object detection
- Optical character recognition (OCR)
- Logo recognition
- Scene recognition
- Not safe for work (NSFW)
Natural Language Processing
- Sentiment analysis
- Named entity recognition (NER)
Each feature has its own dedicated page with an interactive demo. This makes it easy to organize and update in the future, while also enabling targeted marketing efforts for each feature. Additionally, having individual pages for each feature improves search engine optimization (SEO) by providing specific content for each feature, making it more discoverable for users.
Illustrations
I aimed for clarity and simplicity to make the intangible concept of AI easy to understand. I used photos and human images to create a friendly atmosphere, simplified charts for complex information, and stuck to the brand’s color palette for consistency.

Object Detection 
Logo recognition 
Named entity recognition (NER) 
Not safe for work (NSFW) 
Optical character recognition (OCR) 
Scene recognition 
Sentiment analysis
Final Design
About Kirin (Home page)
- Transformed the Kirin website into a sleek one-page layout called “About Kirin”, providing all the necessary information in one place.
- Created a straightforward list of features with simple descriptions and illustrations to help users easily understand each feature.
- Used ChatGPT with guidance from the content writer to create draft copy instead of using placeholder text (lorem ipsum). This helped us have initial content while waiting for the final version from the content team.

Demo page
- Providing a concise description and clear step-by-step instructions to guide users on how to use the demo effectively.
- Added a contact section at the end of the page as a call-to-action, ensuring users have an easy way to get in touch with company.
- To simplify content creation and editing, I leveraged Jet Engine’s dynamic fields, enabling both content creators and developers to effortlessly add or edit descriptions, illustrations, and interactive demos on the page.

Development
This website is our first project using Gutenberg. We opted for Kadence theme and Kadence blocks due to their seamless integration, lightweight nature for improved performance, and user-friendly interface for our developer and content writer. Additionally, we utilize JetEngine to create dynamic fields, enabling us to easily input HTML code for interactive demos and website content. This helps our team to effortlessly edit content and publish new features without any complications.