Comp1773 User Interface Design Guide: Principles, Prototyping & Trends 2026

Introduction to User Interface Design for Comp1773

User Interface (UI) design is a critical skill in modern software development, blending aesthetics with functionality. For your Comp1773 coursework, you are required to design a UI that demonstrates understanding of key principles covered in lectures and tutorials. This guide will walk you through the essential considerations, from visual hierarchy to prototyping, using examples from current trends in AI apps, gaming, and finance tools.

Understanding the User: Personas and Scenarios

Before sketching a single wireframe, you must understand who will use your interface. Create user personas based on real data or assumptions validated by research. For instance, if you're designing a budgeting app for students, consider personas like "Alex, a 20-year-old computer science student who uses mobile banking daily." Pair personas with scenarios that describe specific tasks, such as "Alex wants to split a bill with friends using the app." This approach ensures your design addresses actual needs, not just aesthetic preferences.

Visual Hierarchy and Layout

Visual hierarchy guides the user's eye to the most important elements first. Use size, color, contrast, and spacing to create clear focal points. For example, in a finance dashboard trending in 2026, the account balance might be the largest element, followed by recent transactions. In gaming UIs like those in Fortnite or Valorant, health bars and ammo counts are prominent because they are critical for gameplay. Apply these principles to your prototype: ensure primary actions (e.g., "Submit" or "Buy") are visually distinct from secondary actions.

Consistency and Standards

Consistency reduces the learning curve for users. Follow platform-specific guidelines (iOS Human Interface Guidelines, Material Design) and maintain uniformity in typography, button styles, and iconography. For instance, if you use a hamburger menu, place it in the top-left corner (standard for mobile). In AI-powered apps like ChatGPT or Midjourney, consistent placement of input fields and action buttons helps users focus on content creation rather than navigation.

Accessibility and Inclusive Design

Design for all users, including those with disabilities. Use sufficient color contrast (WCAG AA or AAA), provide alt text for images, and ensure keyboard navigability. In 2026, accessibility is not optional—it's a legal requirement in many regions. For example, the popular note-taking app Notion now offers high-contrast themes and screen reader support. Include these features in your prototype to demonstrate inclusivity.

Prototyping Tools and Techniques

For your coursework, you'll need to submit a prototype. Tools like Figma, Adobe XD, or Sketch are industry standards. Start with low-fidelity wireframes to map out layout and flow, then move to high-fidelity mockups with real content. Use interactive prototypes to simulate user interactions—linking screens to show navigation. For example, prototype a login flow where tapping "Sign In" transitions to a dashboard. This demonstrates understanding of user flows and feedback.

User Feedback and Iteration

UI design is iterative. Conduct usability tests with peers or use tools like UserTesting to gather feedback. For instance, if testers struggle to find the search bar, consider moving it to a more prominent location. In the fast-paced world of social media apps like TikTok, constant iteration based on user behavior keeps the interface engaging. Document your iterations in the report to show the design process.

Current Trends: AI, Gaming, and Finance UIs

In 2026, AI-integrated UIs are everywhere. Apps like Grammarly use subtle animations to indicate real-time suggestions. Gaming UIs, such as those in League of Legends, employ dynamic elements that change based on in-game events. Finance apps like Robinhood use clean, minimal layouts with data visualizations. Incorporate one of these trends into your design to make it relevant and engaging.

Putting It All Together: Your Report

Your report should be around 2500 words, professionally structured, and include Harvard-style references. Cover the following sections:

Introduction: Briefly state the purpose and scope.
Research and Analysis: Discuss user needs, personas, and competitive analysis.
Design Process: Show sketches, wireframes, and prototypes with explanations.
Evaluation: Describe usability testing results and iterations.
Conclusion: Summarize key learnings and future improvements.

Remember to cite credible sources like Nielsen Norman Group, Don Norman's "The Design of Everyday Things", or recent UXPA articles. For example, a reference might be: "Norman, D. (2013). The Design of Everyday Things. Basic Books."

Final Tips for Success

Start early and iterate often.
Use real content in your prototype (not Lorem Ipsum).
Test with at least 3-5 users.
Ensure your PDF submission includes both the report and prototype file.

By following these guidelines, you'll create a UI that not only meets the assessment criteria but also stands out as thoughtful and user-centered. Good luck with your Comp1773 assignment!