sultana mow's profile

Frame layout layer

Frame layout layer

1. Each framework, navigation, and area HE Tuber division are clear and reasonable, in line with user intuition, and can help users quickly understand and operate.
2. Be concise and highlight the core and key points;
3. Information structure layer

1. Reasonable information hierarchical structure relationship


(For example, according to importance, information is divided into primary and secondary, and priority; information hierarchical relationship is expressed according to the color of the content, font thickness, and size); or related functions and information are grouped and displayed in categories.
Common organizational methods include directory structure, tags/tabs, menu navigation, etc.


2. Content of information:


a. Scalability : Consider future expansion and changes when designing the information structure, ensuring that the interface can accommodate new functions and content in the future, and ensuring that other modules will not be affected when updates and adjustments are made.


For example, browsers provide various plug-ins and extensions, and the backend system provides users with customized management interface processes or list content, configuration data attributes, etc.
b. Feedback possible : unambiguous, instructive, concise identification and feedback, helping users quickly find the required functions or information
For example, when entering a page with empty data, it is necessary to guide information to feedback the next possible task action to avoid the user's sense of loss.
Another example is when saving a file, the notification message guides the user to clean up the file disk, etc.


Such as success prompts, form verification prompts,

 button click feedback, abnormal error feedback, etc.
c. Information visualization : In order to facilitate users’ understanding and reduce learning costs;


You can use icons, images and other visualization methods. For example, Amap’s driving icons make it easy to understand self-driving routes; bicycles are cycling routes; progress and percentage icons are task progress.
3. Information relevance and ease of search
a. For example, related functions and content are related through reasonable navigation and menu structure and classification.
Order management: new orders, order cancellations, order records, etc.
Customer management: new customers, customer transfers, customer follow-up, etc.
b. Data association or search:


For example, page jumps for related information, 

clickable settings for labels, and efficient searches through information keywords.
4. Page hierarchy
1. The page hierarchical relationship is reasonable : the operation path cannot be deep and is generally kept at 3-4 levels ; it reduces the complexity of user operations and does not distract the focus of functions.


2. It can be closed-looped, returned, rolled back, and each page is related and complete (referring to the completeness of carrying information, functions, and processes)
3. Ensure the consistency and visibility of page navigation: such as commonly used navigation modes: menu, tab page, breadcrumb navigation, etc.
4. In line with user habits:
a. Hierarchical placement of page information:
Follow the whole to the part, such as list-details-branch operation page; another example is that search is an information query for the global page, which is usually pinned to the top.


b. Functional level placement :
The division of first-level, second-level, and third-level functions is clear and reasonable, with priorities; for example, for a shopping product, the main scenario is to facilitate users to purchase and place orders. You definitely cannot hide the function menu in a deeper page hierarchy.


c. Feedback guidance processing:
For example, in what scenarios are common novice guidance pages placed? For example, after the user completes the operation on the 3-level page, click to return to the previous level or the main level page, or is it directed to a new page?
5. Functional layer
Now that we’ve talked about the interface layer, let’s go deeper and talk about the functional layer.
1. Human-computer functional interaction layer:
Functional interaction: user operation and use
a. Can be closed loop (large function, small function), especially process-type business;
No matter what form of closed loop, it needs to be as operable and traceable as possible (data/operation records)
b. Operation feedback mechanism: operation feedback of normal main branch and abnormal branch


Mainly reflected through color status, text/sound/touch, undo or restore, dynamic interaction (such as real-time data updates, location changes, etc.)
In addition to interactive feedback at the business function layer, feedback design at the non-business level cannot be ignored:
For example, empty page design, toast design (consider the differences of different terminals and use it reasonably), poor network, loading failure, server crash, file non-existence, insufficient permissions, insufficient disk space and other file read and write errors and exceptions, data call exceptions, Security anomalies, operating system version mismatch, etc.
Product managers need to provide handling mechanisms for the above exceptions and continue to monitor, improve and fix them.






Frame layout layer
Published:

Frame layout layer

Published: