Redesign and motion design of Architecture for Education (ADE), a project by National Institute of Architecture and Urban Planning ( NIAIU ).
Done while at Super Super Studio .
About
ADE is a platform for architectural educators to connect and acquire knowledge.
Initially, ADE was an interactive map where architectural educators could find each other. In its next iteration, ADE set out to add 2 new main sections:
- Resource base of educational resources related to architecture,
- Archipedia : an encyclopedia of architectural terms.
I was tasked with UX and UI design for growing the website into a complex knowledge base. This required both deep UX rework and expansion of the brand’s visual language.
Information Architecture
The UX had to be both easy enough for kids and elders to browse through, while also providing a comprehensive filtering mechanism for researchers and students to find exactly what they were looking for.
Design
With the aesthetic foundation laid by the initial website’s design, my main task in the design phase was to add character to the minimalistic and functional UI.
Interactive Animations
The existing geometric branding was expanded with a set of responsive illustrations, playfully depicting concepts such as building, networking, or clarifying.
I hand coded the prototypes to test out different interactions.
See interactive examples live: Home page , Archipedia .
