princeofswank-blog - Tumblr blog

princeofswank-blog · 7 years

Text

Cannot code? Become a UI/UX designer then. Things you need to know to get started.

So, this is my first tumblr post, and I am excited. I intend to post everyday (no promises 😒) anyways I recently got interested in UI/UX design and had been reading a lot and looking for things I would need to get started. I actually thought it’d be really easy, turns out I was wrong 😰)

There’s a lot of content and materials, with most having the same information, and some, just saying things you’d actually not need when you’re working(not naming names). Let’s get started.

UI/UX is a field of design(that’s how I see it) that focuses on how users feel and interact with an application, it can be web or mobile. In more direct terms, have you ever used an app and can’t just seem to be pissed at it, or used another and you’re so angry at the unusability? It all boils down to the UI/UX designer.

The UI/UX design process is actually just four, yes, the number 4. And it’s pretty straight forward, there’s the Research, Design, Implementation and Testing.

Research Phase

It’s the longest and most tiresome part of the process. You’d have to ask the users relevant questions(that is if the product has already been created) like “What did the users think about the initial product”, “Where did they get distracted”, “why did they get distracted”, “what kind of features they would like” etc. There are several ways to even get this done. You can use Google forms, physical paper forms, interviews etc. The designer (by that I mean you) should ask personal questions also like; “what am I trying to solve”, “how do I go about it”, “what features should I add”, “ is the user going to be satisfied” etc. The research phase is really important. The key word in UI/UX design is User. Which means their opinion actually matters.

Design Phase

Protoypes

This is where you get your hands dirty. It’s the part most people would be waiting for and it’s really interesting also. But there are certain things you have to know in the design phase, certain keywords. They include:

Wireframes

Prototypes

Wireframes

Sample picture of a wireframe.

There are wireframes that can be done using applications or by hand.

There are 3 types of wireframes:

Lo-fidelity wireframe

The image above is a lo-fidelity wireframe. Can be drawn by hand. It doesn’t require any digital application at all. After the first process, trying your hands on lo-fidelity wireframes would be very good to start. It would give you an idea of what you would be doing for prototypes and for presentation purposes if you’re working on a team.

Mid-fidelity wireframe

It’s the use of digital or web apps for purpose of wireframing. It gives a cleaner version of lo-Fidelity wireframes. It’s more effective and cleaner to the eyes( because you know, crooked hands and stuff).

Hi-fidelity wireframe

Very much the same as prototyping. Using Invisionapp and Marvelapp are used for prototyping or Hi-fidelity wireframes. KY advise is to make a lo-fidelity / mid-fidelity wireframe so that making a prototype would be actually very easy and direct. Because you know the things to add and not to add. Below is an example of a prototype I created using marvelapp(actually my first, and yes, I’m proud).

Implementation Phase

The marvelapp can allow you add clicks that can Link up to other pages like an actual app. You can end up installing it as an app on your phone and then testing. That’s where implementation comes in. When it works to the satisfaction of the client or your team then they can start working on it.

Long and short of the story is: It’s really easy to be a UI/UX designer. Practise is what actually makes perfect. So practise and Get going. You’d be alright.

Leave your comments or ask lame any questions if none of it is clear.

1 note · View note