Lesson 8: Mobile and Emerging Interfaces

Mobile interfaces have smaller screens and touch input. This means minimalism is key: one big headline or primary action per screen, big touch targets (minimum 48×48 points per Material Design guidelines). The "thumb zone" is a concept: common buttons should be where thumbs can easily reach (bottom area). Philippine apps must also consider connectivity (ensure the UI indicates loading) and local language settings. Responsive design is important: the layout should adapt if someone switches from portrait to landscape. In HCI theory, we learn to prioritize content (e.g. show text and main button first) and use progressive disclosure (collapse advanced options under menus).

Beyond mobile, HCI also explores new modalities. Voice interfaces (like Siri or Alexa) rely on spoken commands: principles include simple grammar and clear prompts (for example, speaking Taglish commands in the Philippine context). AR (augmented reality) overlays digital info on the real world (think Pokémon Go). When teaching AR, courses focus on aligning virtual elements accurately (so objects appear fixed in space). VR (virtual reality) creates immersion; designers must prevent motion sickness by optimizing frame rate. Collaborative or social tech (like online group chats or games) is also covered: HCI looks at how people interact remotely, such as supporting group decisions (groupware). These topics are often at the end of the syllabus as "special issues."

Ready to apply this? The practice set below walks through exam-style problems with step-by-step solutions and a design sketch exercise for mobile layouts.