It was more than 5 years never updated much on my website - johncreative.com. Portfolio was outdated, style sheet was old etc. Designer has lot of excuses for some reason, not to work or spend time on their own design; for myself I was too tight up with works.
So what has motivated me to revamp it; surprisingly I was ’stir-up’ by this font type — Harabara (http://www.dafont.com/harabara.font).
First in my though: “Ok, cool… let use it for my site!”
Furthermore, it was quite common to have one page business card as design theme; apparently, quite number of designers had done it such a way especially things were everywhere - Networks of Facebook, Twitter etc. (5 years ago don’t even have twitter!)
Finally, took me one night to put all icons together and fit with the nice background images. Nuthing fancy about, next stage will working on portfolio page…hopefully.
If you looking for web design resources or references, I have these blogs to share with; it was like a main hub of information not just about web design, but photography, CSS coding etc.
So far, there’s many blogs and forum you can search and try to dig great stuffs. Well, I have “Filtered” them, and here I have 6 blogs provide great inspiration and ideas for my works.
Recently I was setting up a website for my church (PKCMC); and decided to signup the hosting package from 3ix (www.3iX.org) which only cost RM146 for 2 years.
One of the reasons I pick 3iX was because it has this “Fantastico”, Fantastico (wikipedia) is a commercial script library that automates the installation of web applications to a website. And wordpress is one of the features that had ready.
After installing and looked simple till I realized something not right when using Chinese Character and it display “?????”; well, I don’t have this problems on other blog (creadaq.wordpress.com). Searching through google and found out there were many type of answers.
Most commons from Wordpress Support, however, it doesn’t help and I keep on looking at some blog with the same file (wp-config.php) which it have this code…
define(’DB_CHARSET’, ‘utf8′);
define(’DB_COLLATE’, ”);
But it was working fine. So, don’t remove or replace it. It might corrupt your WP database.
Then I found out some resources about SQL database setting for WP. The main issue is that for most systems when you create a database, the collation is set at “latin1_swedish_ci” as default. You’ll need to change that to “utf8_unicode_ci” for all the tables where you plan to include Chinese characters in.
If you have cPanel, try look for mySQL Database or PhpMyAdmin
Well, first I though it was changed by just select it from the drop down. NO! There was many more to be done. Let me show the steps and screens. Please click screen to enlarge.
You’ll see something like this, might defer from yours as some plugins will add their own tables.
Anyway, on this screen, under the “collation” column, if you see latin1_swedish_ci, you’ll need to change that to utf8_unicode_ci!!! Click on the button 2nd from left on the column that says “Action”.
You’ll reach a page that says Structure as shown below, check everything that says latin1_swedish_ci, then click on the edit button which looks like a pencil.
You’ll reach another page like the one above, change everything to utf8_unicode_ci, then click Save.
Then, when you finished saving, go to the tab that says “Operations”.
Change again setting to utf8_unicode_ci, then press “Go”.
Repeat steps for all that are not “utf8_unicode_ci”. Make sure you click each of the list on the left menu.
Finally, you should be able to write in Chinese characters now. See pkcmc.org.
I think 2009 is the year of Twitter, it was hot and everyone has owned one account. Even our Malaysian PM- Najib has one, wonder what has he used it for, calendaring or his though of twitting it. Well, I was not interested to be his “follower”. 
And surprisingly, I have seen some of them come with million followers. Anyhow, people has engaged it and realize there were some designers have created some beautiful icons and buttons for twitter, especially the Blue bird. Just lovin them all…
So, there were some nice twitter icons for downloads.
Choosing the right colors for your web design is a decision that should not be taken lightly. Color is the first thing viewers notice on a webpage. It can evoke a variety of strong emotional reactions and each color can contain a different association. Although everyone’s experience and taste can vary greatly, there are still some basic tenants one can follow when working with color:
Consistency
This applies not only to font and background color, but also to the images and other cursory elements. It would be awkward to have a black and white image on a site full of bright, colorful backgrounds. It is typically best to choose colors that go along with the company branding and it is important that the brand identity seamlessly fits into the design. Also, limiting the design to just a few main colors—2 or 3 main colors and 1 or 2 accent colors—is usually a good standard and helps to maintain the consistency. Too many colors can cause your design to become erratic and visually confusing to the viewer.
Contrast
If you use colored copy, make sure that it contrasts well with the background to be easily legible. Stark color contrast is a powerful tool and can draw the eye, so make sure the most important elements have the most contrast in the design. Having muted colors for your title copy and a bright bold color for the body would be a poor use of contrast, applying viewer focus to the wrong element.
Complements
Complementary color choices are also extremely important. And it’s not just the literal complementary colors that are key, but also colors that complement each other as an accent or highlight. There are many different types of color balances and every designer should be very familiar with color theory and its impact on design. Well, I suggest you can use some online tools such as Kuler Adobe (kuler.adobe.com) to deal with the best combination.
Sometime keep one-two colors . Less color which easy to manage the content and contrast of the branding.
Color Theory
Some designers feel that it is enough to just have a feel for the right colors and that color theory is unnecessary. While having a good eye for color can certainly help develop a good design, color theory is still important. It is important to know what types of emotions your colors will convey so that you cater to your target audience. Click here for more information on color theory. See Color Theory from ColorJack (www.colorjack.com).
Since when I was engaging with twitter, thanks to my old friend KCtang recommended. It was a great tool and so many people was engage with it, “have you twit lately?” soon it become a habit and you might feel uncomfortable if you don’t twit. Oh no! I think it was different type of “Bird-flu” spreading so fast….
Recently I realize some of user has done great design to personalize their designs on twitter. There has already been a range of quality designs showcased on various sites, which has shown an emergence of trends such as the ‘sidebar’. Let’s take a look at some of the best practices around Twitter background design and get to work creating our own.
There were 3 different types of background approach:
1) Using repeating background pattern
http://twitter.com/daniesq, http://twitter.com/msphotogirl and more
2) Background Graphic fading to background color
http://twitter.com/bittbox, http://twitter.com/GordyMac/ and more
3) Extra Large Background Graphic
http://twitter.com/ijustine, http://twitter.com/betterinpink and more
However, you could also get some customize background or template that provided by twitter, http://www.twitip.com/custom-twitter-backgrounds/
Personally I prefer 2nd approach that background graphic fading to the background. Using a single graphic on your profile can help add some visual interest. And it load much faster with less graphics. Let’s start to do my own background on my Sidebar!
First of all, click on profile setting and go to “Change design colors”. Well, brown is always my first choice, change the tone from background, links, text etc. Immediately you can preview the colors from screen. Save the settings once you have decided.
Once I have done that, I get the measurement which is width 460 and height 600; copy the exact background color and start my own theme.
First thing in my mind – Top view on my sidebar; it was easier to arrange my elements such as paper, camera and most familiar’s top view - a cup of coffee.
Just find some of the picture from Google images. Or royalty free images from Stock.xchng (http://www.sxc.hu/)
For example, nice quality of Pencil - http://www.remarkable.co.uk/downloads/wooden_pencil.jpg
Then, rotating and reshape my “ingredient” on PS (sound like frying and cooking, yeah!). Used a lot of drop shadow and simple effects such as rotate and wrap the graphics. Other than that, it was quite straight forward.
Once I have done that and save in JPEG, go back to the settings and click on “Change background images”. Browse and save changes. Done!
Take a look at http://twitter.com/twentyplus
Recently, I was researching and did some works on CSS and new photoshop technics. And I found some of the useful tutorials site that provide a very good steps and even trick to improve your website.
Tutorials 9 (www.tutorial9.net)
Kailoon Design (kailoon.com/category/tutorials/)
PSD tuts (psd.tutsplus.com)
PSD Rockstar (www.psdrockstar.com)
CSS Library (www.dynamicdrive.com)
CSS Drive (www.cssdrive.com)
LAYERS Magazine (www.layersmagazine.com)
Well, it was not that taught to work with Peter Chin - Group Creative Director & General Manager who didn’t know much about web.
Primeworks Studios has established as a new subsidiary of Media Prima, no longer a department (Creative Service Department). However, it was not the main reason why Peter decided to revamp the old design, currently it also lack of portfolio or works.
Old design…
Few months back, I met up Peter’s personal consultant – Sarah Lian (www.sarah-lian.com) who also a famous model in Malaysia. Overall, she knew quite a lot of things and what suppose to have on the new design. Overall, we have a good session and new comments.
Unfortunately, the whole idea had “freeze” due to new team with new set up. But a few months later, we had agree to continue with new design; meet up with Peter again and the whole ideas were very simple – Make public users feel good of CSD and show as many portfolios.
Finally, gone through a few round of presentations, eventually Peter like things to be done correctly and perfect. We had spent most of the time choosing the right photos and videos file… goosh! That was taken up sometime to solve it out correctly.
However, entire website was fully coded in Full CSS; first of all, would like to give the credit to my designer – Cherry. She has done a good work.
Click here to go to the live site!
Typetester! It was listed on the “Best CSS Tools”.
The Typetester is an online application for comparison of the fonts for the screen. Its primary role is to make web designer’s life easier. As the new fonts are bundled into operating systems, the list of the common fonts will be updated.
It makes our preview and display the actual fonts on our screens faster and accurate. However, I find it much useful compare to CSS typeset that I had mentioned in my blog earlier.
Give a try! And you could easily copy the css code by clicking on “Get CSS”.
Recently I have been looking on Web 2.0 UI and realize the full use of CSS and Java Scripts was a big trend now. And less people were using tables in html. Why? Or read this.
Right now, majority of the good and innovative design don’t feature much on full flash, soon or later people “suspended” the idea of full interactive animation. There were few reasons, I think it was because of the search engine or website content unlikely to be searched; or you should read this …
Fully integrated CSS and jQuery, both allow our website interactive and work similar like a flash site. Another benefits, the content is much more dynamic and searchable.
Last year, tmsPortfolio.com was integrated with full Flash. One disadvantage point of it - not friendly for details search or keyword analyze. Furthermore, trouble and hassle for updating when using Flash.
To allow my team member to access the code and they could edit the file easily. So I have decided to move back to html with fully integrated CSS. In addition, the loading time are much faster.
Follow