- 1 Minute to read
Interactions Principles
- 1 Minute to read
Unlike a mobile device or a PC, where the interaction area is only one (the screen), Gary contains several interaction areas in order to provide an intuitive communication experience between Gary and the user.
Due to the amount of interactions areas, and the wide potential usage of each of them, it was necessary to develop a design methodology that on one hand will help developers to use those areas and on the other hand will boost the development process saving development time.
After several months of research, we decided to embrace the "Atomic Design" methodology:
Atomic Design
Atomic design is a methodology composed of distinct stages working together to create interface design systems in a more deliberate and hierarchical manner.
Our atomic design is composed by:
- Atoms.
- Molecules.
- Organisms.
Atoms
Atoms serve as the foundational building blocks that represents an individual interaction output. These atoms include basic sounds, colors, motions, LEDs arrays that can’t be broken down any further without ceasing to be functional.
Head LEDs waiting atom example
Molecules
Molecules are relatively simple groups of atom elements functioning together as a unit completing a functionality. For example, a loading molecule that involves a sound, ring LED animation and a motion movement.
searching for wifi molecule example, composed by three atoms
Organisms
Organisms are relatively complex components composed of groups of molecules and/or atoms, composing a full flow.
conneting to wifi organism, composed by two molecules.