Training on User Experience and UI Design : Notes from Ncell app camp

Design Process

Design is a process and not an end product. Everything should have a meaning. Better understanding of key components and research and validity of necessity is mandatory. Prototyping and refinement is also necessary. After the completion of the project support is required.

Ethnography means to observe, to observe the users. How users are solving the problem and what problems they are facing. The perception of end users can be different than that of the designers’ so this also need to be taken into consideration. The perception is based on the context. Take into account the requirements and the problem that you are solving.

A good design is not just a product buit also an experience try to create one!

User story

Empathize with the users. Put yourself in their shoes, user persona needs to be considered. Make a generic character of the user and write down the key attributes of the user.

Conceptual design

Metaphors, use them. Something like desktop, material design and these are examples of metaphors.


Mistakes: make it early, make it often. Pretendotype, design first approach. Lo-fi prototypes and hi-fi prototypes. Fi stands for fidelity.


Community work through is one of the way for evaluation. Liker scale, good-bad-maybe for rating the user interface. Look into Nelson and mole’s nine heuristics.


  • Pencil and paper
  • Communicate
  • Collaborative edit (wiki, google docs)


Research, do not use templates Build a story Focus on presentation Have Fun!

Elements of design

  • Proximity of the elements
  • Similarity and consistency of the design
  • Common fate (harmony between the elements)
  • Closure

Organization Color Typography

Three Cs of Design

Clarity Consistency Contrast

Less is more. Use whitespace. Reduce clutter. Alignment and grid.

UI elements of Android application
– Android design guidelines

  • App Bar – doesn’t have an app icon, emphasize on color and typography
  • Navigation – Tabs, spinner, Navigation drawer, card view
  • Color Platte – Six colors

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s