top of page
Search
Writer's pictureNadia Hardisurjo

SELF-TAUGHT UI/UX DESIGN FOR WEBSITE

In this millennial era, we can build our own website in 10 minutes! Different from 10 years ago when we have to pay web developer and designer to build website for e-commerce; company profile or personal website.


All thanks to Wix.com and another free website developer that provide us free website service to build our own website within 10 minutes! Seriously, it makes our life easier and as a common people with no knowledge of coding, nowadays it is possible to build our own web with a very simple look.


I use Wix to design my own website a year ago. I was planning to start build personal branding as graphic designer and consultant in social media, so I need a “home” online as a showcase of my works and what I do, I choose Instagram and website as my platform. And then I watched Wix.com advertisement on YouTube, I was fascinated and convinced with the advertisement! It’s like my dream come true, now it is possible to have my own website with no basic coding needed! Because it is so easy to build your own website, like playing Lego, you can plug and unplugged as you like.


Yeah… I thought it’s so easy to design your own website, uh huh… is it? Well… keep reading my story…


So, without further thinking I signed in to Wix and start design my website for free. I started design my website on the Wix dashboard editor, like designing the layout – menus, picking background color and font on the spot. I spent 4 months just to fixing the layout of my web, it is quite tiring because I keep come back and forth to change the layout design and then I realized… I made a wrong move.


In this moment, I realized… I have to do UI (User Interface) and UX (User Experience) design for website! Why UI/UX? Because the approach on User Interface & Experience is, what look you will provide when people come visit your website, what experience that they will have when they first landed on your homepage, what kind of feeling you will have. And it’s made sense to me why I never finish with the web layout using Wix dashboard editor for over 3 months.


After doing some research on UI design on many Google articles, I sum up some simple steps to learning UI/UX design for website if you don't have any background on UI/UX:


1. Find out the purpose

First thing first, find out what is the purpose of having website? Either its company profile or e-commerce, it will affect the UI design of your web. My personal website purpose is for personal branding as professional graphic designer and it will determine the whole concept and content UI/UX design for my web


2. Create the concept design

You need to determine what concept you have in mind on your website look. Is it colorful/ playful/ minimalist/ modern/ etc. Develop the concept of the whole look interface based on the purpose you have for your web, because this will lead to colors and font you will use on interface design. Since the purpose of my personal website is personal branding that can be use as online portfolio, then the concept of my UI design is to show off my personality: simple – clean – modern look for my web

The first sketch drawing of the web layout

3. Sketch the layout & system First, grab a paper, draw the layout of website you want. This is very important to have sketch of interface layout, and put everything you want in the sketch as a starter. With a sketch, you can put all menus on the interface layout as you like. Second, create the system of each menu leading to, what content you want to provide in each menu? Example: Portfolio menu, the content is showcase of your previous work, Services menu is containing what is the services you will provide for potential customers and so on

The raw sketch of layout & system

4. Layout the sketch in digital After sketch on the paper, move it to digital sketch using any of graphics software to have more comprehensive look of UI design. You can put what background color, the menu icons, the font you want to use on digital sketch. It gives you almost real interface mock up


The first draft preview of digital sketch layout option of UI design for my website

With these 4 steps, you will be ready to create your own website with basic UI/UX design, it will save time and energy because you already prepare the concept and interface design you want on your web and you can start to build and decorate your website.


Remember to keep the whole UI/UX design is a whole and unite with the branding you build.

I am thankful for Wix.com for giving me lesson of self-taught UI & UX indirectly. They provide beautiful backgrounds, various options for background colors (you even can mix your own color!), various font options, and many more! It's a pleasant and fun experience to learn develop your own website.

32 views0 comments

Recent Posts

See All

Comments


Commenting has been turned off.
bottom of page