Role: UI designer
Tools: Figma, Photoshop
Collaborator: individual project
I redesigned the user interface for a mobile application called Koinoike. Koinoike serves as a koi caring assistant, providing owners with vital information about their pond status and guidance on feeding each koi fish.
Design System
01 Typography
The Poppins typeface enhances the koi pond management UI with its clean, geometric structure and excellent readability. Its modern yet friendly style complements the soft color palette, ensuring a smooth and intuitive user experience. The even stroke widths and rounded forms create a balanced, approachable feel, making fish care tracking effortless and visually engaging.
02 Color
This color palette balances warmth and tranquility. The bold E54F5A red adds energy, while soft coral (FDACAA) and peach (FFB17A) create a calming feel. Muted F6EDED keeps it clean, and fresh A9C568 green adds a natural touch, making the interface both inviting and functional.
03 Grid
The grid layout ensures consistency and clarity with a multi-column structure. 20px and 30px margins provide balanced spacing, enhancing readability and ease of navigation for a clean, user-friendly interface.
20px
30px
Features
Overview of Your Koi Pond
The Home Page provides a comprehensive snapshot of your koi pond, displaying key details such as fish types and recent water logs. Users can quickly assess the overall pond health and stay informed about water conditions with intuitive visual indicators. With a streamlined layout, the Home Page ensures easy access to essential updates, making fish care management both effortless and efficient.
Monitor Water Quality & Fish Health
The Log Page enables users to track and analyze water quality and fish health over time. It presents general text summaries while allowing users to refine their search using filter tags to quickly find specific logs. For a deeper dive into details, users can add or edit floating cards, ensuring precise record-keeping and better insights into their pond’s ecosystem.
Customized Feeding Plans
The Feeding Calculator helps users optimize their fish’s diet by providing personalized feeding plans. The process is simple: first, select a specific date for scheduling; next, choose the food type and quantity based on expert guidance. This feature ensures that koi receive the right nutrition, promoting their health and longevity while preventing overfeeding.
Ideal Plant Selection
The Water Recommendation page offers tailored suggestions for plants that thrive in your pond’s environment. Based on water conditions, users can discover the best plant options to enhance aesthetics, improve water quality, and support a balanced ecosystem. This feature helps users create a sustainable and visually appealing pond with minimal effort.
