ARAYA WONGWAN

INFORMATIONINFO EMAIL INSTAGRAM

Interaction and visual designer applying coding, psychology, and research background to bring new visions to digital. Constantly challenging myself to break boundaries and question the status quo to make positive impacts. Incredibly ambitious to help others and enhance the visibilities of social and cultural issues. Apart from web, I am currently art directing an immersive installation, co-founding an awareness platform, and learning motion design.

PRESS & FEATURE

EXPERTISE

Creative Coding / Art Direction / Visual Design / User Interface Design / Interaction Design / User Experience Design / Writing / Research / Rapid Prototyping

EXPERIENCE

Freelance Designer & Developer - Independent
Co-Founder & Art Director - PUBLIC, International
Research Assistance - Action for Southern Africa, London
General & Economic Policy Associate - The Black Institute, New York
Research Analyst - Nonviolence International, New York

EDUCATION

MA Interaction Design - Harbour.Space University, Spain
MSc Public Policy - University College London, UK
BSc Psychology; BSc Social & Critical Theory - Wesleyan University, USA

Herma

Project

Herma

Date published
June 2020
Project duration
4 weeks
Type of project
Installation
Role
Web & interaction design, creative coding
Team

Louisiane Trotobas

Bingxin Feng

Veronique Nyberg

client
Louisiane Trotobas
The Brief
To design and code an abstract and experimental website for the user to explore gender fluidity. The website serves as an extention to the immersive interactive installation that re-imagines gender using light, sound, and scent.
The Concept
The website defies the conception of binary gender using abstract visual designs. The site features several experimental canvas for the user to explore their identity freely, ridding themselves of pre-concieved notions of gender. With little explanations, the site provides a blank slate for the user to explore the space and respectively, their gender. Through abstraction, the multi-sensory experience strives to de-construct the normative idea of gender representations and expectations.
landing page
The logotype and heading font selected evoked the publication’s bold and irreverent tone. Logotype fits the “get to the point, no BS” brand personality – it doesn’t try to do anything or be anything other than what is stated. The high contrast of the sans-serif balances the aggressivity with the feeling of newness and adaptibility. The transitional type selected for the body font complements the heading font while being legible for longer text due to its wide capitals and open apertures.
first space
The goal for this space is to create a fluid experimental context for the audience to read and explore ideas behind the installation. Accompanying the enigmatic sound in the background, the dripping ripples on the obscure grey canvas introduces the audience to the deconstructed concept of gender.

As the audience moves their cursor, they will discover that the dripping effect is interactive and is sensitive to speed and motion. Texts appear as the audience scroll vertically and horizontally. The text color is intentionally hard to read for the audience to moves the cursor to play with the fluid ripples and discover the text. This technique forces the user to physically engage and internalise the abstract concept.
second space
The fast-paced moving texture in the background creates a game-like environment for the audience. Having no indication of where the each sound is coming from, the activity encourages the user to dive into the pool of experimentation. The shape-shifting space aims to remove the audiences’ sense of control and expections. The user is to fully immerse themselves into the space to “lose” themselves in order to find themselves again, uninhibited.
THE GRID
Familiar geometric shapes are used to guide the audience through the experience. The square draws attention in approachable and balanced manner. The cross indicates closing of the tab; its rounded corners gives an approachable feeling. Circle is used on the top right hand corner of the canvas when the introduction tab is closed. Its faded blue color differentiate itself enough from the white to let the audience know they could click on it and something would happen. Yet, the color is light enough to not distract the user from the exercise.