TokTok Android App 

Agenda

  • Highlight/Suggest the scope of improvement
  • Google's design support library
  • Material design basics

Navigation Drawer

Suggestions to improve Navigation drawer

  • Icons/images
  • Font/color
  • Section Distinctions
  • Settings, Chats, Votes, Contacts can be moved to navigation drawer
  • Shortcut for other important features

Suggestions to improve Tab host

On Android, avoid using bottom tab bars. It will help maintain a consistent experience with other apps on the platform and prevent confusion between actions and view-switching.
On iOS, bottom tabs are generally the top-level of the app information hierarchy, with navigation often occurring within those tabs. Thus, the tabs are often persistent across the app. On Android, if the navigation drawer is present, it should take precedence, with tabs as the second level of hierarchy. Navigating within a tab should take you to a new screen with an Up button. The tabs shouldn’t remain on-screen.

Chat List View

Suggestions to improve Chat List View

  • Keep it clean and accessible on one click from navigation drawer (not in any tab host)
  • Add an elevated  button to create new chat (Google material design)
  • Sticky, persistent and normal conversation can be a separate link in navigation drawer
  • Theme colour is blue, avoid using same colour in chat list items. Combination of black and grey coloured fonts with different sizes can make app look more appealing
  • For new users, creating sticky, persistent chats can be confusing as it is hidden until we select enterprise contacts

Votes

Buttons

Suggestions to improve Votes

  • Form design can be made more appealing
  • Button colour/design can be enhanced
  • Popups can be removed from Option text
  • If user keeps option text blank, then popup is not necessarily required to show error message(instead disable button and show error in red label)
  • Suggestions for vote list view applies similar to chat list view in previous slides
  • If there are no votes created or participated by user we can show a nice user friendly message to create new vote

Settings

Suggestions to improve settings view

  • Name can be an Edit text, if user changes it then we should enable edit option button in the top right corner
  • Contact IDs opens three popups for single operation. Can be simplified by opening a new View and back button
  • Passcode Lock can be replaced with a checkbox
  • Restore all prompts can be replaced with a checkbox
  • FAQ asks to open a browser, instead we can open a new view, avoid opening web browser for showing static data

Contacts

Suggestions to improve contacts view

  • It can be moved to navigation drawer for easy access
  • Users like photographs, provide them options to upload photograph of their contacts. If photograph is not upload, show default image
  • If favourites or group is empty, show friendly message to add contact
  • Clicking on contact list item should allow user to navigate to contact detail view. As per the current implementation, user is forced to click on the right arrow image button in contact view list item.

Miscellaneous Suggestions

  • App should be self marketable
  • App should give delightful experience to users, add animation in layout transitions(Google Material Design)
  • Description in Google play lacks many of the important features such as enterprise contact management, CM Portal
  • Application should be self configurable, least dependency on hello tech managing enterprise contacts
  • Mobile first approach should be promoted, CM portal can be downloaded as a separate mobile app or it can be baked into TokTok so that admins can manage their contact list without accessing CM Portal account in web
  • TokTok needs aggressive marketing and it is lacking positive rating and reviews in Google Play. We can publish articles in different blogs to promote the app and get more downloads.

Android Design Support Library

Android Design Support Library

  •  Introduces material design, a new design language that refreshed the entire Android experience.
  •  Android 2.1 or higher devices.
  • Navigation drawer view, floating labels for editing text, a floating action button, snackbar, tabs, and a motion and scroll framework to tie them together.
  • Introduces CoordinatorLayout, a layout which provides an additional level of control over touch events between child views, something which many of the components in the Design library take advantage of.
  • Collapsing toolbars, floating action buttons, AppBarLayout are the other important views added in design support library

Thank You !

TokTok Android App UI

By Narendra kumar Soni

TokTok Android App UI

  • 685