UI_program resource specification

Documentation instructions:

• Standardize the naming format of UI files and resources, improve the efficiency of UI and program docking, and formulate this specification.

Table of contents:

1. Design, Resource Format
2. UI naming format and specification
3. Scenario example

1. Design and resource format

• Interface design size: 750 x 1334 (physical pixel px)
• Background picture:
  1. Large background: 750 x 1700 format: jpg
  2. Scene background: The format is: jpg
• UI resources:
  1. Give priority to png_8
  2. If there are special requirements, or if the picture is distorted, the bit depth should be increased
  3. try to reuse
  4. Try to consider Jiugongge stretching (reduce the use of gradients)

2. UI naming format and specification

1. The file name should contain the main information of the file, including but not limited to: document type, archive path, file serial number, file status, etc. See the example for the format structure:
   

Illustration:
1: file type
2: folder
3: file serial number (same type plus number)
4: file status (multi-state)

2. The spacers in the file name are all underlined, the same below.

3. Scenario example

1. Startup page
   loading_bg.jpg (startup image)
   loading_logo.png (startup logo)

2. Main interface
   main_btnPlay.png (login button)
   menu_btn_1.png (menu button 1)
   menu_btn_2.png (menu button 2)

3. Character
   icon_pet_1001.png (Pet 1001 Avatar)
   img_pet_1001.png (Pet 1001 Image)