QA checklist

From Ethora iOS & Android ERC-20 & NFT tokenized community platform
Revision as of 10:17, 5 June 2022 by Taras.filatov (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Visual checks

Fonts and Branding guidelines

Please refer to the Branding guidelines page for general fonts and branding guidance.

By default, Poppins font family is used in Ethora UI.

Poppins font has 5 variations. Bold and Black variatons should be used for headings and Light should be used for the content.

Note: The above, of course, is subject to any project-specific branding changes applicable to the specific project. In case you are making changes, your design team can create own branding guidelines based on our initial document.

Colour Scheme

"Background Light": the background colour used for the Top Header and other default backgrounds

"Background Dark": the background colour (typically a slightly darker hue of the "Background Light" used for the Navigational Header and other navigational backgrounds, e.g. the top part of the User Profile screen, to visually divide them from the main background.

Icon and Splash Screen

Applicaton Icon should be present and visible in the smartphone screen.

Splash Screen should be present and visible during launch.

Main page / lobby

Nav bar

  1. Header & navigational section is visible in the top consisting of two sections: Top Header (above) and Nav Header (below) which visually occupy under 20% of the screen height and 100% of the screen width.
  2. Top Header uses "Background Light" colour.
  3. Nav Header uses "Background Dark" colour
  4. Top Header displays the App Title (aligned to the left), Balance Box and Menu icon (both aligned to the right).
  5. Nav Header displays the Rooms Tabs. By default these are "Official", "Private" and "Groups", with "Official" being selected by default.

Body

  1. Body displays the list of Room Cells corresponding to the currently selected Tab.
Room Cell
  1. Displays the Room Icon (aligned to the left). If not defined, displays first 2 letters of the room name.
  2. Displays the Room Name (goes after the room icon, taking most of the middle space remaining between the Room Icon on the left and the Members Icon & Members Counter on the right). The font is smaller here so that there is space left under the Room Name to display the Latest Message.
  3. Displays the Members Icon & Members Counter (both aligned to the right). Members Counter displays the number of users that are subscribed to the room.
  4. Displays the Latest Message under the Room Name. Latest Message is shown in a font size slightly smaller than the Room Name, and the less intensive colour. Last Message includes: "<First name> <Last name>: <Message body excerpt>" (all aligned to the left) and the Last Message Timestamp (smaller font, HH:MM format, aligned to the right and displayed under the Members Icon & Members Counter). In case the Latest Message is not retrieved from the room yet, the following should be written in its place: "Tap to view and join the conversation."

Bottom / overlay UI

  1. In the bottom right, an overlay "Manage Chats" icon is displayed.

Menu

The menu opens via tapping the Menu Icon in the Top Header.

It has the following items:


ACCOUNT

  • Profile - view user's own profile (same as tapping on the Balance Box)
  • Transactions - view transactions history of the current user
  • Settings - manage account settings such as e-mail addresses etc

--

ACTIONS

  • New chat - creates a new chat room
  • Scan - scan a QR code (to join a room or get details of another user)
  • Mint items - (optional, depending on settings) mint new NFT Items

--

SYSTEM

  • Debug - (hidden by default, only shows if user has tapped 3 times on the Application Title area prior to opening the menu)
  • Logout - log out of the Application


Functional checks

Transactions - Items tab

  1. Items tab should display a list of cells of which Items (NFT-type tokens) the profile owner has in their wallet. Each cell should display: (1) A thumbnail preview (on the left) for images and videos. (2) A play icon overlay over the thumbnail (for audios and videos). (3) Item name (the middle space - taking most of work space horizontally). (4) Item rarity and quantity the profile owner wants (for example "3/5" means the profile owner owns 3 copies of the total issuance of 5 of the current Item).
  2. Audio and Video Items should be playable directly from their cell in the "Items" tab. This means that User doesn't need to tap on the item to open Item Details screen and then tap again the preview image / icon to play. User can play directly from the Items tab by tapping on the preview thumbnail or "play" icon in the left side of the Item cell.
  3. Same as above, Image items preview should open when tapped on the Image thumbnail in the Item cell.