Hayao Miyazaki Website
website + UI/UX
This project involved creating a professional website for Hayao Miyazaki. The website aimed to showcase his life, work, and influence on animation to a broader audience, including his existing fans and those new to his work. The website featured a clean, minimalist collage design reflecting Miyazaki's artistic style that evokes a sense of nature, warmth, balance, and contrast between character and background. It was organized into sections that provided information on his biography, life and career, film works, awards and achievements he had received, and contact. In addition, the website included a gallery of his film posters, where viewers could watch trailers and read summaries and synopses of his films.
Hayao Miyazaki is a renowned Japanese animator and director known for his captivating storytelling, memorable characters, and breathtaking visuals. He has created numerous critically acclaimed and award-winning animated films. Miyazaki's work has had a significant impact on the animation industry, inspiring filmmakers and captivating audiences around the world.
Hayao Miyazaki's films predominantly showcase female protagonists, as he believes that their actions have a more significant impact on the audience. Miyazaki has openly expressed his preference for women, stating that he finds them gallant.
Miyazaki is renowned for his eco-friendly and anti-war beliefs and his effective critique of the far-right factions in Japan. Nature often plays a significant role in his animations, and he portrays the dual symbolism of nature and the adversarial symbol of human civilization and nature. Miyazaki's work effectively expresses this duality. The theme of resolving conflicts through coexistence between nature and humans permeates Hayao Miyazaki's works. Inspired by his thoughts, this website featured collaged images that can be a contrast between backgrounds and some of the videos to showcase Miyazaki's work and create an engaging user experience.
used Adobe Photoshop for collage: cool filter, black and white filter + filter gallery (film grain)
Feedback
homepage menu button: box & word color changes when hovering
menu icon: bouncy when hovering
menu section: color changes when hovering
The water drop shape of the menu icon can suggest fluidity, motion, and change, which is appropriate for a website dedicated to the works of a renowned animation director. The three drops lining up imply balance and harmony, common themes in Miyazaki's films. The cream and dark forest green colors you used for the water drops also have specific meanings. The cream can symbolize elegance, purity, and simplicity, while the dark forest green can evoke feelings of nature, growth, and tranquility. These color choices complement the rust-orange background and add visual interest to the menu icon. The shape and color of the menu icon effectively conveyed the desired mood and tone for Hayao Miyazaki's website and reflected the design aesthetic and creativity
location mark icon: color changes when hovering
"x" icon: changes to "-" when pressing to close
poster: animation when hovering
loading: pulsing animation after clicking each menu selection
The rust-orange primary color can evoke feelings of warmth, energy, and excitement. It is a bold and attention-grabbing color that can also convey a sense of creativity and playfulness, which aligns well with Miyazaki's imaginative and whimsical style. The dark forest green is inspired by the natural themes and settings found in many of Miyazaki's films, while the cream and rust orange add warmth and depth to the design.
Hayao Miyazaki's popular film scene
Hayao Miyazaki's Ghibli nature scenery
