With the conceptual, visual framework established, the next step moves from visual translation to structural, and functional definition. Building a coherent semantic architecture requires clarifying how content, interaction, and feedback interconnect across the system. Through wireframing, the underlying structure of Sense becomes visible: outlining essential GUI elements and defining how overarching application component function within the broader behavioural design framework. This stage bridges conceptual intent and user experience, ensuring that every structural decision supports orientation, intuitive navigation, emotional coherence, and purposeful interaction. To achieve this the following method was applied:
ERAF System Design
______________________________________________________________________
Building Blocks| Arranging elements into architecture
Building on the visual framework, fundamental building blocks are needed to be structured into a coherent semantic architecture, the backbone of its digital ecosystem. As the practice of organising content into an effective and intuitive system, every layer will be aligned, from the visible interface to the unseen operational logic beneath. Therefore, each object is defined, named, and linked to attributes and functions, while points of access are evaluated form multiple perspectives to ennsure clarity consistency, and scalability.
Onboarding
Site Maps | Wired in system and sense
Understanding how each block interacts with the others reveals the structural rhythm of the system: which elements remain hidden yet essential, which invite direct engagement, and how feedback flows between layers to refine both experience and outcome. Pictured as a dynamic sitemap diagram, a detailed map of all components wired to their counterparty, the depth, width, and operational intelligence of Sense multi device system is now captured, ensuring that every connection is purposeful, tested, and durable in practice.
Core Feature
Final Form | From low to high fidelity
With the semantic architecture as its foundation, the transition from structure to visual realisation begins. Each mapped and tested building block evolves into an interactive surface, transforming conceptual logic into sensory experience. As fidelity increases, wireframes gain depth and emotion, where function meets feeling, and complexity turns into clarity. The result is a cohesive visual language in which structure, aesthetics, and interaction merge into one intuitive flow.
______________________________________________________________________
