Sunday, 30 August 2015

UI / UX Designer

What is UI / UX Designer?

Basically, UI stands for User Interface and UX for User Experience.

These terms may not familiar with normal people who are not related in Tech world.

It is pretty similar with a website designer as following designing concept.

But, the difference is that the website designer design the simple website, menu, contact page, etc

while UI / UX designer design interactive functions for users as a website application.


For example, one of the customers asked me build a simple website for his restaurant, which website is required simple navigation, menu, picture, etc. It needs to have a website designer. After that, the customer asked me the booking function on the website. Then, it is necessary to design the functions including all the process, which is what UI/UX usually do.

So, we can say that the term of UI/UX designer may include web designer as UI/UX designer is more specialised in the design area.


For more details, please watch the YouTube video attached below.
https://www.youtube.com/watch?v=P6-sedIvt7E

Friday, 28 August 2015

Responsive Youtube Embed

1) Put the code into css file


.video-container {
     position: relative;    
     padding-bottom: 56.25%;    
     padding-top: 30px
     height: 0
     overflow: hidden;
}

.video-container iframe,.video-container object,.video-container embed {    
     position: absolute;    
     top: 0;    
     left: 0;    
     width: 100%;    
     height: 100%;
}

2) Put the code into html file


<div class="video-container">
         <iframe src="http://www.youtube.com/embed/dFVxGRekRSg" frameborder="0" width="560" height="315"></iframe>
</div>



Reference - http://avexdesigns.com/responsive-youtube-embed/





Mobile First

Definition 1

Mobile first is a business strategy and that assumes smartphones, tablets, and task-specific apps are employees' primary tools for getting work done.

Reference


Definition 2

Mobile first means designing an online experience for mobile before designing it for the desktop Web or any other device.

Reference


Definition 3

Mobile first menas content first. Fancy hover menus, sliders, flash-based animations - all the clutter is taken away at the beginning, and instead of focusing on effects what is being considered is how to display the content in the most rational way.




Reference


Tuesday, 18 August 2015

Portfolio

My new portfolio website is just launched.

Skills requried:
HTML, CSS, JavaScript, JQuery, Bootstrap and Photoshop.

Design Concept: Simple & Simple

Colours: #edc951, #eb6841

As a portfolio website, it is required relatively little content compared to general website. So, I focus on the design for catching visitor's eyes at a glance.

For the purpose of website,
I would like to show my design and coding capability as a front-end web developer. All the information and works would be collected into the website so that everyone could see who I am, what I have done and what I am currently doing.

http://www.jdcoder.com/jun_portfolio/portfolio/