Ways of Word / Original published motion study
01 / Ways of Word
The context
A game-interface study that connects visual design to animated presentation. It shows another side of my practice: motion, playful interaction and game UX working together.
Reading the problem / Ways of Word
Expression needs a legible response.
The published game-interface study focuses on playful interaction and motion. Its scope differs from the current Unity builds.
Ways of Word is a published UI and motion study, not one of the current Unity game builds.
How can a game-interface study communicate playfulness through hierarchy and timing?
Evidence: the project account and the attributed artifacts on this page. Process drawings and interaction studies are reconstructed explanations; numerical research or business results are included only where separately supported.
02 / Ways of Word
The design focus
- Game UI and visual direction
- Animated interface presentation
- After Effects and Figma exploration
The process / Ways of Word
A direction.
A way to build it.
The game-UI study makes an action and its expressive response legible inside a motion sequence.
A schematic of sequence and overlap, not a dated project schedule.
Establish the starting state
Introduce enough interface context for the viewer to recognize a later response.
Define the interaction beat
Identify what action the animation is intended to communicate.
Explore expressive feedback
Connect visual direction, Figma exploration and animated presentation around that response.
Review the resolution
Let the feedback finish communicating before introducing another competing beat.
How can a game-interface study communicate playfulness through hierarchy and timing?
The study introduces a game interface, shows an interaction and resolves it through visual feedback. The viewer should understand the relationship between action and response even inside an expressive motion presentation. That is a different goal from demonstrating a complete playable game.
Journey map / Ways of Word
See the whole task in context.
Choose a step to connect the person’s intent with the interface and the design decision.
Introduce the game UI
Ways of Word is a published UI and motion study, not one of the current Unity game builds.
- Interface context
- Game interface
- Review question
- How does the interface make turn ownership unambiguous?
Representative task sequence and recovery path, not a measured emotional curve or historical research map.
Behind the experience
From composition to a consistent deliverable.
For Ways of Word, this map connects “Introduce the game UI” to “Resolve the sequence”. Read across to follow the task, then select a layer to inspect the interface, design and delivery references behind it.
| Layer | Introduce the game UI | Show an interaction | Give visual feedback | Resolve the sequence |
|---|---|---|---|---|
| The task | Introduce the game UI | Show an interaction | Give visual feedback | Resolve the sequence |
| Visible interface | Game interface | Game interface | Interaction beat | Feedback beat |
| Design checkpoint | Ways of Word is a published UI and motion study, not one of the current Unity game builds. | Introduce an understandable game-interface state. | Make the action behind the animation recognizable. | Resolve the response before adding another expressive beat. |
| Implementation reference | Introduce enough interface context for the viewer to recognize a later response. | Identify what action the animation is intended to communicate. | Connect visual direction, Figma exploration and animated presentation around that response. | Let the feedback finish communicating before introducing another competing beat. |
| Recovery | Unsuccessful landing → communicate the result → allow the next valid turn | |||
A reconstructed delivery map: the implementation row summarizes design-process dependencies, rather than claiming to document the original backend architecture.
Give the response a readable beat.
Reconstructed comparison of design approaches. These are review studies, not a claim that both directions were historically tested or shipped.
What this direction changes
Give the response a readable beat
Lets visual expression reinforce what the player just did.
Give the interaction and its feedback separate beats.
The reconstructed storyboard distinguishes the initial UI, an interaction moment and its response. This makes the source of the motion understandable: the interface is reacting to something, rather than animating continuously without a reason.
Introduce an understandable game-interface state.
Make the action behind the animation recognizable.
Resolve the response before adding another expressive beat.
Try the interaction
Ways of Word / Composition study
View 01
Game interface
Introduce an understandable game-interface state.
Introduce the game UI
Game character should not obscure the next action.
Separate expressive game headings, interaction prompts and response labels. Typographic personality should leave the animated feedback understandable.
Introduce the game UI.
Resolve the sequence.
24 / 30 px · regular16 / 26 px · regular12 / 18 px · regular12 / 18 px · regularPortfolio-font hierarchy illustration; the source does not establish the exact client font or token scale.
Make expression serve the response.
How does the interface make turn ownership unambiguous?
The interaction beat needs a recognizable starting state. Without it, the viewer can enjoy the movement without understanding what the interface is communicating.
What feedback explains a valid landing without distracting from the physics interaction?
Feedback can be expressive while still resolving the action clearly. The visual treatment should reinforce the response rather than hide it under a second competing message.
Connect the animated response to the UI state.
The original work joins game UI, Figma exploration and After Effects presentation. A motion reference should identify the state before the interaction, the response being illustrated and the point where the sequence resolves. That keeps the animation tied to interface meaning.
A proposed AI-assisted variation should reuse the existing game-interface language and a bounded interaction. Keep the presentation separate from current Unity development, and do not turn a polished response animation into a claim of implemented gameplay.
Ways of Word is a UI and motion study, shown separately from the in-development Unity games.
Accessibility & standards
Access belongs in the design.
For Ways of Word, carry accessibility requirements from the core user journey into component states, prototypes and engineering acceptance criteria.
WCAG 2.2 AA · EN 301 549 · APCA · WAI-ARIA · Platform guidance
Turn the palette into usable roles
Document approved text/background combinations for body text, large text and UI components. Assess functional content against WCAG 2.2 AA; use APCA to refine type size and weight.
Carry identity without losing meaning
Provide non-color cues, readable type hierarchy and accessible template reading order. Review captions and a reduced-motion alternative for product films and animated applications.
Make the rules usable in production
Include accessible color tokens, component states and content guidance in designer, developer and Claude/Codex references. Logo presentation alone does not establish interface accessibility.
Review scope & standards references
These are design references and review priorities, not a claim that this historical project passed a WCAG audit. Record criterion-level evidence, assistive-technology and device results, unresolved issues and retest outcomes before making a conformance statement.
APCA supplements the WCAG 2.2 contrast checks; it does not replace them. WCAG 3 remains a draft. EN 301 549 v4.1.1 is the latest published edition checked on 6 November 2026; its publication and its formal EU legal citation are separate matters. Confirm the applicable procurement or legal baseline with the client.
Outcomes & scope
What the work delivers.
- A published UI and motion study. It is presented separately from the current Unity games.
Results are described within the documented project scope. Illustrative studies are identified separately from original project artifacts.
Review & next iteration
What needs to hold up in use.
Use these questions to review Ways of Word against the behavior the design is intended to support.
- 01
Can the viewer identify the action that caused the response?
- 02
Does the next interaction remain clear after the animation?
Project-specific acceptance questions for a future review, not reported usability-test results.
Reflection / Ways of Word
What I’d carry forward.
Playfulness becomes clearer when an action receives an understandable response. The useful next experiment is to vary the expression while preserving that interaction rhythm.