View the Presentation at SlideShare
Introduction
Scope
This workshop is for UI designers and UI developers who are part of creating digital products such as websites and applications.
Purpose
What’s the Problem? Workshop was created to uphold the importance of UI team’s role in providing right solutions to right problems thru UI design.
Goals
The workshop aims to accomplish the following:
- foster collaboration among designers and developers
- set a standard way of organizing projects
- establish a standard process in design and development
- produce a prototype thru HTML, CSS, JS (HCJ)
UI
User Interface (UI)
UI is the layer that facilitates interaction between a human and computer.
Examples with figures: the power button of a mobile device, the dashboard of an operating system
User Interface Design
UI design aims to make the interaction easy and efficient.
Thus, UI design wants positive user experience (UX).
Positive UX helps users achieve their goals and consequently, the business its goals.
Figure 1.
Happy users = Happy business
UX
Providing Positive UX
The key to providing positive UX in a digital product is identifying the users’ and the business’ goals and eliminating the hindrances along the way. This challenge entails solving problems and it is important to note that we must match right problems with right solutions – the team’s mindset, dynamics, and techniques play a big role in overcoming challenges.
Team
The product team is tasked in providing positive UX. It might be composed of:
- Business developers
- Product managers
- Developers and engineers
and ultimately the ones directly handling the UI:
- UI designers
- UI developers
Right Mindset
It’s been told countless times about the inspiring story of a NASA janitor who, in the 60s USA, was asked by JFK what his job was. The janitor replied, “Well Mr. President, I’m helping to put a man on the moon.”
There are two important aspects of this anecdote that shows how a right mindset in a team should be:
1. Oneness in the mission and vision of the company. As part of a whole, we must be aware of our company’s core business – how it sustains itself, its dream of the future.
2. Pride in one’s work. No matter what your role is in the company, your work is substantial just as long as you are working towards one goal as the company.
You might be tasked in exporting media assets for a mobile app but you must be able to say, “I’m helping to launch a product for people living in remote areas to be connected to the internet.”
As designers and developers, we simply do not transform mockups – we create and design; we simply do not encode directions – we develop and innovate.
Fig. Create, Innovate
Right Dynamics
There’s a right combination of people in a team that makes it capable of fulfilling the work needed and at the same time sustaining itself. It allows for its members to move up the professional maturity ladder individually. This is an ideal ecosystem of teams whose responsibilities are defined and each member has an area of expertise.
Fig. Furious 7, Ninja Turtles, McGyver (for a one-man team)
Levels
- Team Lead – skills management, establishment of standards and processes
- Senior – project and time management
- Junior – implementation
Fig. Guru, Rockstar, Ninja
Roles
- Architect / Planner
- Designer / Communicator
- Engineer / Implementer
Technique
Our kind of work (UI designers and UI developers) revolves around problem-solving. It is important for us to employ techniques that will lead us to discover where deeper users’ problems lie.
Right Questions
A very common technique to employ everytime a kickoff meeting commences is asking the right questions. This is our opportunity to find out more about why a client wants a particular thing done. Usually, the answer falls in the lines of fulfilling users’ or business’ needs.
A conversation with a client might go like this:
Client: My company needs a website.
You: When do you need it?
This would surely go the wrong way especially if the client just assumed that it is a website they need. By asking the right questions, we would begin uncovering the right problems.
Client: Can you design a website for my company?
You: Yes but before we go into details, may I ask what you would like to achieve by putting up a website?
Client: I would simply like to put up the contact information and map of my store up there so that they could simply find my business.
You: Who are your customers? Are most of them on Facebook?
Client: Our customers are mostly the younger generation and I believe they are on Facebook.
You: Are you open to setting up a Facebook page first?
Client: Will that be able to display the contact information and map of my store?
You: Yes.
Client: Sounds good to me. Let’s set up that Facebook page right away.
Most of the time, the alleged answer is already being handed over to the UI team – waiting to be transformed into a mockup or front-end prototype. But with just a bit of an extended inquiry and conversation with the client, we were able to find out a need that the client is trying to fulfill.
The wrong path is when a UI designer or UI developer would simply take a to-do list and simply achieve delivery on time. As experts in our fields, we should know why we’re doing what we do. As designers, one should be able to say why a particular margin is 16 pixels and not 14 or 18; as developers, there must be a reason why a particular framework was used for a project – to say the least.