Design for different target audience.

•January 8, 2009 • 4 Comments

I am in class now, and they are talking about writting for different group of users.

Target audiences plays a huge role in many things, such as  marketing for a product. So.. I am going to write on how to design for different group of audience when I get home. I will talk about web usability too.

This is going to be fun.. Stay tuned.

To SIWM-T02:
Come back to learn more on effective web design.

My best way to learn: Tutorials.

•December 3, 2008 • 2 Comments

I was first inspired by my sister, who is also a web developer; she does really cool sites (interactive, appealing aesthetic, etc…)

There was once I saw her doing a project with Fireworks, whatever she was doing it felt like magic. First it was a blank canvas, then.. BAM it became a user-friendly and nice website. I can’t help being amused by it.

So I pestered her to install it on my desktop (P4, ME Edition) for me. I explored the functions and pester her again on how to use this tool and that tool. She was paitent, she thought me as much as she could and know. Then it came to a point that I felt that I need to know more! It wasn’t enough for me.

I was encouraged by my sister, and I turned to… Tutorials. Woo, online tutorials are like the best thing ever. The next thing I knew, I fell in love. Not with a boy, but… Designing.

Today, I am going to share with you some of the best tutorial sites and what I’ve done.

Best Tutorial Sites
#1: Smashing Magazine

smashingmag

Smashing Magazine stores most of the amazing tutorials. Smashing Mag is more than just tutorials, they have inspiring articles, free downloads of brushes, fonts, lessons to CSS (In web2.0, tables are out and css is in.) and etc. I want an internship with Smashing Mag.

I look at Sven Lennartz  (Founder of Smashing Mag) and dream,” I want to be like him. I want to be the owner of yet another smashing magazine.” No it’s not silly dream. Randy Pausch once said in The Last Lecture,”..it is important to have specific dreams.” -Sidetracked-

#2: DeviantArt

deviantart

DeviantArt is a community where people from all over the world post their works. DeviantArt consist of inspiring works, not just graphics, it has flash games, videos, games, and more. 

DeviantArt offers a wide range of tutorials from user internationally. o_o Kick ass eh? There’s even CG tutorial. 

Web Design ain’t just about vectors, lines, circles and what’s not. Increasing numbers of web designers are looking at combining photography and vectors together. A particular inspiring photographer: Larajade. She’s only 17 or 18 and she is already being highly sort after. 

My First Tutorial
Looking at all these, It got me, I want to make tutorial too. :D I am going to show you guys, my very first tutorial. It’s easy, you can try it too!  

background

This is a tutorial to make a simple wallpaper.

First, you need Photoshop. I am not going to post all the steps here, download it here if you are interested to learn how to go about doing this.

My Firework Works

This are really early works of mine. A couple of them are photoshop tutorial’s result. Enjoy! That’s all for now. I’ll post my latest designs next time.

BubbleShare: Share photos - Find great Clip Art Images.

My to-die-for Books and Magazines

•November 26, 2008 • 6 Comments

Now, you know the crap design. I’m just going to highlight some of the best book about good designs that I really enjoy and love.

#1: Idea Index: Graphic Effects and Typographic Treatments by Jim Krause

This is simply love. There are little text and many illustration. I am someone who falls asleep when threw with a huge chunk of text. So, illustration for me is the best. In Idea Index, it shows how fonts can be manipulated and design so that it is not boring.

Typography makes a huge different in design.

#2: The Non-Designer’s Design Book by Robin Williams

Detailed C.R.A.P Principle can be found here. Another favourite is.. of course, it includes typographic principle. :D – wonders – Anyway, the book is simple enough to understand. You do not have to be a designer to read it. Note, it’s called The Non-Designer’s Design Book. It talks about the 3Cs of Types too.

It doesn’t mean that you have to design websites or.. interface to read these books. These skills can be applicable on your powerpoint slides, or word document and etc.. It will make your work more professional.

#3: Web Designer and Advanced Photoshop Magazine

Lastly, the web designer magazine! Wooooooo. It never fails to inspire me with successful stories of some world-reknown or inspiring designers. It does not only talks about stories of designers, it features advanced or use photoshop tutorial. Well, web designers ain’t only about photoshop. It provides detailed tutorials for dreamweaver and flash too.

Not to mention, the magazine includes cd that has sample files, brushes, patterns and more!

Same goes for the Advanced Photoshop magazine. They teach you how to turn ugly duckings into swans. Awww, How wonderful!

Grab some of them and read. It will make you a better designers or someone with more design senses.

Is it C.R.A.P or CRAP?

•November 19, 2008 • 3 Comments

As a webdesigner for web 2.0, understanding the C.R.A.P Design is important. Here’s what C.R.A.P stands for:

C – Contrast
Just like the word says, contrast means to compare in order to show unlikeness or differences to compare in order to show unlikeness or differences.

With technical terms, contrast refers to the differences of sizes, colors and shapes use to distinguish two elements. So, to show you guys the contrast:

thisiscontrast1
credit to me.

R – Repetition

Repetition in your text is bad; repetition of your design elements is not only good but necessary.

Quoted from Design Better with Crap.

True? Yeah. Imagine you have a page full of repeated text. Mm, How do yo actually read it? Is the information correct? Designers used repeated design element for the design to stand out; It is called Pattern. I used Damask pattern a lot of the time, rather than a solid color, it adds live to the design.

Here’s an example:

demo2demo1

Which is more attractive? Is it the one with a repetitive background or the one with a solid color?

A – Alignment
Alignment simply means to arrange everything in a straight line. Every element must be connected to each other. With alignment, a page will look very clean, neat and sophisticated. Content should be left, right or center aligned too.

getgoodsensecomment by me. screenshot from getgoodsense.com

I hope the comment is readable, otherwise, click on it. The two pictures drawn in red circles are my only concerns. It looks a little out of the place, doesn’t it? If only the text are justified. Anyway, the site looks great as a whole though. It’s neat and they really are good sense.


P – Proximity
Proximity: nearness in place, time, order, occurrence, or relation.
Well, you don’t want your content to look like they are not related to each other at all, so why are they all on the same page? With Proximity, it can help the user to find the information they want easily.

wireframe_dev_roncredit to me.

Look at the spacing of each of the content on the page. That’s proximity, equally spaced out, and still look like a site as whole.

I think Group8020 has a good proximity for its content.

Lastly, CRAP really just means crap.

3. refuse; rubbish; junk; litter: Will you clean up that crap

Well, I think I’ve cramped you with enough information. Till then.