Serene Entrapment: Interactive & Generative Hero Image Artwork.
Immersing users in a trapped serenity by using crystal healing & human energy flow fields (chakras) to develop a sense of grounding and user connectivity.

OVERVIEW

For Design Programming (DECO1006), I was inspired by the biological representations of humans & cybernetics when using JavaScript and creative programming to mimic the energy that runs through humans (as we are made of atoms).

Elements of crystal healing, grounding and generating a 'trapped' sense of serenity to immerse users inspired a comprehensive piece of creative code.

ROLE

Designer, Developer

TEAM MEMBERS

Sole Designer

DURATION

Apr - May 2022, 4 weeks

ACHIEVEMENTS

Highest overall mark in the cohort, presented at University of Sydney's Chancellor's night and USYD Open Day.

Snippet of code.
Embracing the impact of
microinteractions.

Serene Entrapment uses code to create a peaceful & immersive experience for users, but it also strongly encourages a 2-way relationship between the design and user. This is fundamentally powered through a series of micro-interactions where despite small, can encourage users to interact in a unique way and develop agency during the experience.

Increasing ellipse thickness based on user's finger or mouse placement.
Users can only know this effect once they actively engage with the sketch, as this calming energy and experience can only be offered and felt by those who seek it. A thin line in an energy flow is more calming, quieter and soothing, whereas a thicker line represents boldness and excitement. This coexistence brings this energy field to life and connects it to diverse individuals.
360° movement of crystal based on user interaction.
The user can interact with the crystal by changing its rotation according to the X and Y position of the viewer's mouse. Although the user is in a constrained sense of serenity, they still have some control in this energy field. It helps convey that this experience is interpersonal and responsive to their decisions.
Creating new, colourful environments by a tap or click of the user's mouse.
The background colour array is filled with colours representing different crystals: rose quartz, amethyst, pink sapphire, moonstone, jade, orange quartz, and black onyx. Crystals can prevent negative energy and boost the body's aura. Different crystals provide different meanings, so I wanted to ensure I included different varieties to surprise users with a different experience, every click.
Embracing the power of movement through using keyboard arrows.
For those viewing the sketch from a device with a keyboard, they can interact using the arrow keys. This is another action users can take spontaneously to see what happens. The purpose is to reinforce autonomy users have in this realm of peace and serenity.
Made with 🍵 & 💗 in Sydney, Australia. (。˃ ᵕ ˂ )