Portfolio Review techniques

Recently, the team I have been working on is hiring for senior designers. And I went through all the portfolio review and design exercise parts. As an intern, I learned so much from those candidates, and I want to share all these useful points with you.

Portfolio Review

Every candidate starts from the portfolio review part. Before that, here are some tips you should prepare:

1.Don’t forget to bring your laptop

One of our candidate didn’t bring his laptop and got the impression of “not fully prepared”. Bring your laptop, open your slides, test everything before you get to start. This will leave a good impression for the interview.

2. Smile and Confident!

When you are presenting, always remember that your audiences are real people, not just machine. Speak slowly and clearly, make sure everyone can hear you and get you. Be confident: walk into every room like you own it. This will create a good presentation atmosphere and will bring a big bonus: the team will think you are those kind of people who is easy to collaborate and communicate. This is also considered into a cultural fit.

3.The presentation should be clear and logical

One of the candidates left a very deep impression on me. She presented her work with a very clear and logical flow:

-Introduced project background

-Tell us the difficulty and problems

-Tell us about your team and your contribution.

-Show design process: how to define the problem, how to do research, what kind of tools she used, what results came out, what she learned at the end.

-Deep dive into several important part: you can’t present the whole process, just pick those points which you think is important and deep dive into it. Remember that, very decision should be justified.

-Focus more on the problem-solving part: some candidates introduced a lot about the tools they used, but we are more willing to hear about how you solve problems.

4.Storytelling skill is important

One of the candidate is very competitive, but our team’s feedback is not so good to her. Her skills are very solid, but our team has doubt that if she is easy to get along with. “She’s work is definitely strong, but I don’t know why that it seems so boring” And my mentor even said that if we are a consulting firm, we won’t heir her. So what’s wrong with it? The candidate didn’t engage people very much, she just kept demonstrating her work. Here are some tips:

-Pay attention to the pace of the presentation: don’t start too long or end too quick.

-Pay attention to audience’s face, if they seem confused, ask question like “Does anyone have question?” or confirm if they have questions in the end of every section

-Create climax for a story

-Eye contact with audiences

-Add some humor(don’t pretend to be humor if you are not)

 

5.Prepared for questions

Be very familiar with your projects, people always have questions along the presentation. List all the possible questions and try to practice to see if you can answer all of them. Good answers to questions will validate your performance and your capability.

 

Some other things you should know…..

Before you apply for a job, read carefully about their job description. Team is also looking for people who fits them. For example, for your work is more strong at UI, maybe you should not consider a UX position, because it become hard for the team to position you.

Understand clear about yourself and understand about those jobs you want to apply is always an important thing.

Wish everyone can get a dream job 🙂

 

 

Usability and Accessibility -Examples for accessible websites/software

This article is mainly focus on the examples for accessible websites. The author discussed about the text alternative and color accessibility as examples. In those cases, audiences can get to know the definition, effect, bad and good use cases of these two examples.

When the internet comes, we live in a life with full convenience: We shop easily on the internet by just one clicking with the mouse; We search various resources for a report by pressing the keyboard. But there are amount of people who might not see, hear, even click by hands. We expect computer can make a better life for all people, including people with disabilities because even a small consideration means a huge step to them.

Above all is the original of web accessibility. Gradually, accessibility has a broader scope: besides the traditional advantages for disabilities, people without disabilities also get benefits from it. For example, an appropriate button size makes it easier for people who has a big thumb to click when they are using a cell phone. The overall goal of accessibility is to deliver effective and efficient interaction with digital products for all people.

The definition of web accessibility means people can perceive, understand, navigate, interact with and contribute to Web.(W3C)

And it is summarized into 4 main rules:

  1. Perceivable information and user interface
  2. Operable user interface and navigation
  3. Understandable information and user interface
  4. Robust content and reliable interpretation

From the horizontal range, almost every industry uses digital products to serve different needs in people’s daily life. From the vertical range, in the technology field, designers, engineers, product managers, have the same goal to develop a better product. No matter from horizontal or vertical range, accessibility plays an important role. Let’s see the following exact cases based on that.

In many web pages, images brighten content up. But in many situations like when encounter internet errors, it might create problems. In order to make sure people can understand images in any situation, text alternative is a frequent take away. Text alternative means when the users can’t see the image, alternative text should be displayed. And text alternative can be categorized in to the first accessibility rule: Perceivable information and user interface

Figure-1/ picture by google develpoer

This is an image from Google Developer website(Figure-1). Through inserting a section of code, a line of text which explains the image would displayed beside the image. Users who encounter difficulty in capturing images can understand the content by reading the text. Text alternative is a standard coding process which has been possible since HTML2 in 1995, and was part of the original WCAG1 guidelines in 1999 (Julie Grundy, 2.4.2016).

How to add useful text is also an art. Sometimes, the beginners just use the literal name like 13278217812.jpg as alternative text. It is accurate but it means they forget the aim of alternative text is to improve accessibility, to let users understand content in unstable situations. So, accessibility is not only designers’ job but also engineers’.

The second case is about color accessibility. First, that’s see a comparison picture:

Figure-2 / picture by Alex Bulat

The left part of the image shows a vision from non-colorblind people(Figure-2). The right part shows a vision colorblind people. We can see that for those colorblind people, they can hardly distinguish each line. So, for those colorblind people, the traditional web design might decrease the readability and makes it difficult to use.

In order to solve this problem, there are many software for designers to test accessibility like Chrometric(Figure-3). “What you see is not what everyone gets”, designers should always remember that when you design for a product which be used for everyone (like Amazon), it is really very important to remember to apply accessibility in your design.

Figure-3 / picture from Chrometric

Sometimes, color accessibility will not only affect colorblind but also non-colorblind people. Below that is a bad example. In the picture, the text is in white and is very unclear in front of the image(Figure-4). In order to improve the accessibility, one way is to add a dark mask in front of the picture(Figure-5), it will make the text more solid and easier to figure out.

Figure-4 / picture from Jay Wennington

Figure-5 / picture from Jay Wennington

Some would argue that we all know that we shouldn’t put a white text on a colorful background. But devil is always in the details. Think of that, it is very common that designers use a very beautiful image with text on it as a banner in the prototype. The images might be very high-end and good looking. But if it is a UGC platform, all the content is generated by users which means the images might be very low-end, and the readability of the text can’t be controlled(Figure-6). Designer should always think beforehand about all accessibility problems.

Figure-6 / picture from Qinsman

We have talked about the accessibility in both design and develop. From my own perspective, they all link together. Go back to the beginning, our companies in various industries want our developers, designers, product managers to work together to deliver good product. The logic and goals behind design or technology is the same, designer or engineers just use their own language to achieve that goal. So, accessibility should not only be limited in one scope, but everyone in this Industry should better understand and apply it to deliver better products for every user.

Reference:

Google Developer – Text alternative https://developers.google.com/web/fundamentals/accessibility/semantics-builtin/text-alternatives-for-images

W3C (web accessibility initiative)                                        https://www.w3.org/WAI/intro/people-use-web/principles

Three common accessibility pitfalls for developers: text alternatives (Julie Grundy 2.4.2016)      https://simplyaccessible.com/article/three-pitfalls-text-alternatives/

Improve the color accessibility for color-blind users (Adam Silver)  https://www.smashingmagazine.com/2016/06/improving-color-accessibility-for-color-blind-users/

 

 

 

Design Critique: Venmo (App)

I choose Venmo (App) as my design critique topic. Venmo is an online digital “wallet” for people to make and share payments between their friends. It makes easier among friends to split the bill. The critique is based on the principles and methodologies from Don Norman’s book: Design of Everyday Things. In the critique, I want to discuss how Venmo meets/fails at these principles.

Discoverability for payments

I believe the most important feature for Venmo is to make payment. But when users enter into the home page of Venmo, it shows the records of your friends’ payment. As a user, what I concern is I can’t discover any button or text as a signifier which I can press to make payment directly. It againsts my conceptual model. The situation becomes even worse when I try to make payment for a new friend: the ‘search people’ button is hided within the ‘hamburger’ menu. It is difficult for users to discover, especially for new users.

Also, transaction is a very private activity for me and I am not so interested with my friends’ payment records. It feels strange because it is not an UGC (user generated content) platform like Facebook, people actively post content which generated by users themselves. Instead, Venmo brings me a feeling that I am stalking others’ lives by reviewing their payment records.

I have checked some other articles online and I found that many people have the same concern with me. Here is an article about why you should set your Venmo account to private:  http://internet.gawker.com/heres-the-number-one-reason-to-set-your-venmo-account-t-1687461730

 

And here is my suggestion: In the homepage, I put a button with ‘Request’ and ‘Purchase’ at the top as a signifier for users to discover and make payments directly. When users click the button, they can choose friends or find a new one.

And I list transaction which associated with myself as default because it fits my conceptual model better: I care more about my own transaction, but not my friend’s. When I enter the home page I can make payment immediately and also check my payment.

 

Feedback for records

When users successfully make them payment the screen will add a column about payment details as a feedback. It is a pleasant design because users need to be confirmed about the transaction. But I also think the user interface can be improved a little bit: In the screen, the image and the icons are relatively big, but the payment amount is small. As a user, I will pay attention to 1) who I pay for 2) how much I have paid. 3)what I pay for.

So, here is my suggestion: I reduce the size for both image and icon and enlarge the size of receiver and the amount. I also notice that the receiver’s name is clickable. But it is in black color. It leads to discoverability problem, so I also change the receivers’ name with blue color to make it more clickable. Overall, I intend to make the feedback more clear and clean.

 

Constraints

In the ‘Pay & Request’ page, when users check ‘Pay’, it will jump to a new page. In this page, users can input the amount and the receiver. Below the page there is a green button: ‘confirm your payment’. It is a good constraint. Because transaction is an activity people should be very carefully with. This button acts like a second confirm to the users and avoids misoperation mistakes.

 

Conclusion

Overall, Venmo convenient people lives, makes it much easier for us to make payments. But it still has some UX details needs to be improved. I believe it is better for Venmo to focus more on the payment than the social network because its first priority is always payment but not to be a social platform.