Application design project 3 redesign lofi
Wang Zilong 0361141
Application design
Bachelor of design in creative media
Project 3
INTRODUCTION
Redesigning a Carrier App: A Full-Process Guide for Low-Fidelity Prototypes
In the modern digital age, carrier apps (Apps) have become an important tool for users to manage communication services and accounts. However, many carrier apps still face problems such as insufficient user experience and cumbersome interfaces. In order to improve user satisfaction and the actual utility of the app, redesigning the carrier app is an essential step. In this process, low-fidelity prototypes play a vital role. This article will detail how to use low-fidelity prototypes to redesign a carrier app, from concept to practice.
Determine goals and requirements
Set redesign goals
Before The first step in redesigning a carrier app is to clarify the project goals. We need to determine the core functions and user needs of the app, such as:
Account management: users view and manage bills, packages, and usage.
Service requests: users submit questions and requests, such as technical support or service changes.
Interactive experience: improve user operation fluency and ease of use of the app.
Collect user feedback
Understand the pain points and needs of users in the current app through questionnaires, user interviews, and market research. This feedback will guide us to focus on issues in low-fidelity prototypes. Common issues may include:
Unclear function positioning: users have difficulty finding the functions they need.
Complex operation process: multiple steps are required to complete certain tasks.
Outdated interface design: the visual effect is not modern enough, which affects the user experience.
Create low-fidelity prototypes
Hand-drawn sketches
Before starting to design, hand-drawn sketches with paper and pen are an effective preliminary design method. This method can quickly conceive and verify design ideas without being restricted by tools.
Main interface: Draw the main interface layout of the application, including account overview, notifications, navigation menus, etc.
Function interface: Draw the interface of core functions, such as billing details, package selection, service request form, etc.
Navigation process: Design the main flow of users from one functional area to another, and ensure that the process logic is clear.
Wireframe
Use digital design tools (such as Balsamiq, Adobe XD or Figma) to convert hand-drawn sketches into wireframes. Wireframes are a form of low-fidelity prototypes that provide a clearer interface layout and functional structure.
Interface layout: Design the basic structure and element position of each interface.
Interactive elements: Mark the position and function of buttons, links and other interactive elements.
Information display: Clarify the information and data that needs to be displayed on each interface.
Design core interface
The low-fidelity prototype should cover the core interface of the application:
Account management interface: including account overview, bill viewing, package management and other functions.
Service request interface: Design a simple and intuitive form so that users can easily submit service requests or problem feedback.
Settings interface: Users can adjust personal settings, notification options, etc. here.
Draw user flow
Draw the main operation flow of users in the application to help the team understand how users complete tasks. Including:
From the main interface to account management: how users enter account management from the main interface to view bills and packages.
From the main interface to service request: how users submit service requests or problem feedback.
From account management to settings: how users access and adjust settings in account management.
Verification and iteration
User testing
Show the low-fidelity prototype to target users and collect their feedback. The goal of this phase is to identify problems in the design and make necessary improvements.
Usability testing:
Observe how users use the prototype and record their difficulties and opinions during operation.
User interviews:
Discuss with users about their views on the design and obtain their feedback on the functions and interface.
Collect feedback
Analyze the feedback from user testing to identify problems and improvements in the design. Common feedback may include:
Complex interface:
Users feel that there are too many interface elements or the information display is not clear.
Unintuitive operation: Users have difficulties in completing tasks and the operation process is not smooth enough.
Missing functions:Functions that users want to add are not included in the design.
Iterative designIterate and improve the low-fidelity prototype based on user feedback:
Simplify the interface:
Reduce unnecessary interface elements and improve the simplicity and clarity of the interface.
Optimize the process:
Adjust the operation process, reduce steps, and improve the efficiency of task completion.
Add functions: Add or adjust functions according to user needs to meet user expectations.
The contents inside the lofi:
1. Functional Requirements
1.1 Account Management
Account Overview: Displays basic information of users, including account balance, billing cycle, package details, etc.
Bill View: Allows users to view historical bills and current bill details.
Package Management: Users can view, select or change their packages and services.
Service Request
Issue Feedback: Provides users with the function of submitting technical issues, service requests or complaints.
Request Tracking: Users can view the status and processing progress of the requests they submitted.
Recharge and Payment
Recharge function: Users can recharge their accounts through the application.
Payment function: Integrated payment gateway allows users to pay bills and other fees.
Notifications and Messages
Push Notifications: Users can receive account-related notifications and system messages.
Message Center: Centrally manages all notifications and messages, and users can view history.
Settings and Personalization
Personal Information: Users can edit personal information, such as contact information, address, etc.
Notification Settings: Users can set preferences and frequency for receiving notifications.
Privacy Settings: Allow users to manage privacy settings and permissions.
Customer Support
Online Chat: Integrate customer service chat function to provide real-time help.
FAQ and Help Documents: Provide answers to frequently asked questions and use help documents.
2. User Interface Design (UI)
Interface Layout
Main Interface: Design a simple and intuitive main interface, highlighting key functions such as account overview and notifications.
Function Navigation: Use a clear navigation bar or menu to facilitate users to quickly access main functions.
Visual Design
Color Scheme: Choose colors that match the brand image to ensure visual unity and brand recognition.
Typography and Fonts: Use easy-to-read fonts and appropriate font sizes to improve the readability of text.
Icons and Images: Use intuitive icons and images to help users better understand functions and operations.
Interactive Elements
Buttons and Controls: Design buttons and controls that respond quickly and feel good to enhance the operating experience.
Feedback and Prompts: Provide instant feedback when users perform operations, such as visual changes after clicking a button or prompts to confirm the operation.
Responsive Design
Device compatibility: Ensure that the app can display well on various devices (mobile phones, tablets, etc.) and screen sizes.
Touch optimization: Optimize the interface design for touch operation, and ensure that the size and spacing of controls are suitable for finger operation.
User Experience Design (UX)
User Flow
Simplify the process: Optimize the process for users to complete tasks, reduce steps and complexity. For example, the path from the main interface to bill payment should be as simple as possible.
Task priority: Put the most commonly used functions in an easily accessible location to reduce the user's operation steps.
Usability
Consistency: Ensure the consistency of interface elements and operations, so that users can quickly adapt between different pages or functions.
Easy to learn and use: Design a simple and intuitive operation interface so that users can easily get started without additional learning.
User feedback
Feedback mechanism: Provide clear operation feedback, such as successful submission, error prompts, etc., to help users understand the results of their operations.
Help and support: Provide easily accessible help and support options in the application to solve problems encountered by users during use.
Personalized Experience
User Settings: Allow users to customize the interface and functions according to their personal preferences, such as theme switching, notification settings, etc.
Smart Recommendation: Provide personalized function recommendations and services based on the user's usage history and behavior.
Security and Privacy
Data Protection: Ensure that users' personal information and account data are protected and comply with relevant privacy regulations.
Permission Management: Clearly explain the permissions required by the application and provide users with options to control permissions.
Design Verification and Optimization
User Testing
Usability Testing:
Collect feedback through user testing to discover and solve problems in the design.
A/B Testing: Conduct A/B testing of different design versions to determine the most effective design solution.
Iterative Optimization
Analyze Feedback: Iterate and optimize the design based on user feedback and test results.
Continuous Improvement: Update the application regularly and make improvements based on user needs and technological development.
REFLECTION
In the process of redesigning the communication app, I chose a low-fidelity prototype as a tool for preliminary design. This choice was mainly based on the fact that low-fidelity prototypes can quickly and effectively demonstrate design concepts while allowing us to quickly iterate and adjust in the early stages. The whole process gave me a deeper understanding of the design requirements and user experience of the application.
First, the process of making low-fidelity prototypes made me realize that simple wireframes and hand-drawn sketches can intuitively present the basic structure and functional layout of the application. During the drawing process, I focused on core functions such as messaging, contact management, and settings interface. The focus of this stage is to ensure that the functional logic is clear and users can easily find the main operation points.
Secondly, through user testing, I received valuable feedback on the interface layout and operation process. Users pointed out some confusions that may be encountered in actual use, such as unintuitive navigation and unoptimized functional layout. Based on these feedbacks, I made several rounds of adjustments to the prototype and improved the location and interaction process of interface elements.
In the end, the low-fidelity prototype not only helped me verify the design ideas, but also laid a solid foundation for the production of high-fidelity prototypes. It ensures that the app’s functionality and user experience have been preliminarily verified and optimized before we enter the visual design phase. This process made me deeply realize that when designing complex apps, low-fidelity prototypes are a key tool to ensure design quality and user satisfaction.
Comments
Post a Comment