.jpg)
Skill
Role
Software
Brand Development
Creative Direction
Web Design
Web Development
Content Writing
Brand Identity
Illustration Direction
Responsive Web Design
Web Development
Content Writing
Adobe XD
Wix Studio
Adobe Photoshop
FLAMo School
Web Design for FLAMo School
Creative direction and web design for FLAMo School, an online motion graphics school based in Japan. Inspired by an underwater city, I crafted a brand identity and web design that reflect the curiosity of creative exploration and a vibrant community of diverse individual students.
Project Summary and Concept
FLAMo, known for illustration-driven motion graphics launched an online school. As a motion graphics designer within FLAMo, I understood their unique character animation style deeply and used that insight to create a concept inspired by an "underwater city"—a vibrant community where students and professionals can explore creativity and learn together in their own ways.
To ensure easy, fast updates by multiple administrators, I built the website using Wix Studio, a no-code tool that allows efficient editing and content management long after launch.
Flexible, CMS-Driven Web Design with Wix Studio
Using Wix Studio's CMS, I designed a web page for FLAMo School's online courses. To organize information like course overviews, schedules and instructor profiles, I implemented a navigation tab system and customized content pages by connecting multiple database collections.
This setup allows for intuitive updates, making the website easily manageable and adaptable for ongoing course management.
Working on FLAMo School was an exciting project where I led all aspects of design, from brand identity proposals and illustration direction to web design.
I also handled comprehensive content design, including crafting website taglines and content, alsocreating social media thumbnail images.
This cohesive approach strengthened FLAMo School's brand presence and firmly established its unique identity.
Working on FLAMo School was an exciting project where I led all aspects of design, from brand identity proposals and illustration direction to web design.
I also handled comprehensive content design, including crafting website taglines and content, alsocreating social media thumbnail images.
This cohesive approach strengthened FLAMo School's brand presence and firmly established its unique identity.
FINAL OUTPUTS
Web Design for FLAMo School
Playful Colour Palette for the Underwater City Concept
The underwater city web page features a rich deep-sea blue background with a gradient that darkens with scrolling, simulating depth.To avoid a dark or monochromatic feel, I introduced a vibrant, high-saturation palette, adding a playful, surreal touch.
This colorful palette became the basis for the brand's style guide, influencing the logo and custom illustrations throughout the site. Key visuals and cut illustrations were crafted by the talented illustrator Anima.
Price Slider and Keyword Tag Filter
For the course listing page, I designed a refined search feature allowing users to filter courses by keyword tags and budget.
With the support of Velo Developer Kazuki Niihori, we integrated a price slider controlled via Velo, directly linked to CMS course pages.
This setup dynamically displays only the courses within the user's chosen budget range, enhancing the browsing experience by focusing on relevant options.
Playful Colour Palette for the Underwater City Concept
The underwater city web page features a rich deep-sea blue background with a gradient that darkens with scrolling, simulating depth.To avoid a dark or monochromatic feel, I introduced a vibrant, high-saturation palette, adding a playful, surreal touch.
This colorful palette became the basis for the brand's style guide, influencing the logo and custom illustrations throughout the site. Key visuals and cut illustrations were crafted by the talented illustrator Anima.
Price Slider and Keyword Tag Filter
For the course listing page, I designed a refined search feature allowing users to filter courses by keyword tags and budget.
With the support of Velo Developer Kazuki Niihori, we integrated a price slider controlled via Velo, directly linked to CMS course pages.
This setup dynamically displays only the courses within the user's chosen budget range, enhancing the browsing experience by focusing on relevant options.
Web Animations with Wix Studio
All animations on the website were created using Wix Studio, enhancing the site with immersive, playful elements.
Parallax scrolling brings a 3D effect to moving fish, while looped animations of a submarine and diver exploring the underwater world add richness and interactivity, making for a captivating browsing experience.
Web Design for FLAMo School
