The Steph Soul

WD2 { Interface Design }

2010-09-23T14:46:00.000-07:00

{ Home }

{ Menu }

*Still in progressing.
welcome for any comments.

WD2 { Moodboard & Revised Site Map }

2010-09-16T12:19:00.000-07:00

WD2 { Design Tutorials }

2010-09-10T13:53:00.000-07:00

1 { How to design a cool grungy website layout }
2 { Create a Medieval Fantasy Castle Gate in Photoshop }
3 { How to Create a Grunge Web Design in Photoshop }
4 { How to Create a Rusty Texture in Photoshop }

More { Url }

1 { www.pslover.com }
2 { www.psd.tutsplus.com }
3 { www.smashingmagazine.com }
4 { www.abduzeedo.com }

WD2 { HTML/CSS Tutorials }

2010-09-10T02:05:00.000-07:00

1 { Image Gallery }
2 { Show Alert Box }
3 { Image Transparency }
4 { Go Back Button }
5 { Pausing Up-down Scroller }
6 { Flexi Slide Show }

More { Url }

1 { www.w3schools.com }
2 { www.dynamicdrive.com }
3 { www.htmlcodetutorial.com }
4 { www.echoecho.com/javascript.htm }
5 { www.tizag.com/htmlT }

WD2 { Beautiful Commercial Website }

2010-09-09T02:21:00.000-07:00

Beautiful Commercial Website 1 { Pizzaza }

{ Good }

- The icons of navigation bar superb impressed me.
- Overall design very clean and comfy.
- Photos of the website quite nice.
- Arrangement of composition very neat and looks nice.
................................................................................................................................................................

Beautiful Commercial Website 2 { La Maison Bisson }

{ Good }

- Above the fold of the website can straightly bring me to their restaurant.
- The design looks relax and attracts me.
- Design of the navigation bar and others detail also quite not bad.
................................................................................................................................................................

Beautiful Commercial Website 3 { The Villager }

{ Good }

- Most of the things of this website impressed me a lot!
- Some of the typefaces are pretty nice and suitable to use.
- The navigation bar looks creative and won't feel dull.
- The color mood and some simple detail design very not bad.
- Overall it brings out a classy feel yet good design.
- Photos of the site pretty nice and professional.
................................................................................................................................................................

Beautiful Commercial Website 4 { Pomona Valley Mining Co. }

{ Good }

- The overall vintage feel is nice and quite comfortable to look at it.
- Composition organized well.
- Simple yet nice.
- Have its own theme.
................................................................................................................................................................

Beautiful Commercial Website 5 { Pizzeria }

{ Good }

- I can noticed a lot of nice interactive of this website between users.
- So far the design no doubt is pretty nice and suit for the restaurant's theme as well.
- Well organized about the composition and have been used in this website.
- Above the fold of home page already quite attract me to continue with their site which I think it's an important issue to consider for my coming redesign commercial website.
................................................................................................................................................................

Beautiful Commercial Website 6 { Kbachbin Kabayok }

{ Good }

- The whole design and color mood can't deny are utterly nice and good.
- The details part attract me well like the logo, navigation bar and info parts.
- This website inspired me a lot for my coming redesign commercial website - The Ship.
................................................................................................................................................................

WD2 { Competitors Website }

2010-09-08T07:23:00.000-07:00

Competitor 1 { T.G.I Friday's }

Analysis

{ Good }

- The design suits their theme. - Extra flash effect. - Menu page not bad. Nice arrangement. - A lot of efficient info.

{ Bad }
- Font size a bit small.
- Only the home page applied simple flash.
- Home page too many info, looks a little bit messy.
- Navigation bar can be more interesting.
...............................................................................................................................................................

Competitor 2 { Tony Roma's }

Analysis

{ Good }

- The photo slide of homepage very nice and looks very professional.
- Good to have a little bit of animation when navigate at the top. - Current promotion page very comfy and nice.

{ Bad }
- Navigation bar can be improve. - Design can be more interesting.
...............................................................................................................................................................
Competitor 3 { Bubba Gump }

Analysis

{ Good }

- Very neat.

{ Bad }
- Arrangement too save. - Nice concept and logo but website not attractive enough.
- Typography not interesting. - Information make me don't feel like reading. - Website not match with their theme. (not for the Bubba Gump store)
...............................................................................................................................................................

Competitor 4 { Victoria Station }

Analysis

{ Good }

- A lot of information to search on.

{ Bad }
- The website make me feel like unfinished. - Italic word used in most of the articles, hard to read. - Design not very nice. - Menu don't have any nice photo to attract/show to users. - Whole website quite boring and dull.
...............................................................................................................................................................

WD2 { Client Website }

2010-09-07T22:33:00.000-07:00

Client Website { The Ship }

Analysis

{ Good }

- Clear information like location, menu and history.
- Very caring and good idea to have a feedback page for users.

{ Bad }

- Design not attractive enough.
- Need some animation/flash to enhance the website.
- Photo in homepage move too fast, can't see it with comfy.
- Some of the HTML codes are ran, it looks very not professional.
- Arrangement of typography can be better and improve widely.
- Navigation bar quite boring.
P/S: Corporate colors of The Ship are brown and maroon color.

WD2 { Gantt Chart & Site Map }

2010-09-07T22:08:00.000-07:00

Type Application Design (Typo Project)

2010-06-30T11:25:00.000-07:00

KFC

Tourism Malaysia

Typo _KFC & Tourism Malaysia

2010-06-06T15:33:00.000-07:00

Below are some of my websites that I tried out for layout design : )
After I compared to the original website, I found out actually I've changed whole
style and feeling of both of it. Maybe because I preferred these kind of
relax and more daily life art style.

Before this, I've done a lot of website research. There are really tons of
interesting and cool websites for us to take as reference. I think
I can get better outcome if I'm not lazy to do much much much of research ^^

Enjoy ~

Web Design1 - First Sketches

2010-05-30T17:40:00.001-07:00

BEFORE u scroll down and look through my VERY first basic idea of sketches...
Oh ya >< I already mentioned that these are my Very very very first basic idea of
sketches. Hahaha : )

By the way, although it is very simple and still without any actual photo yet
but I'm sure that it can helps to understand MORE about what am I gonna
do in my VERY first html website : )

Ya... That's it. Enjoy~

1. Homepage
These are a few layout design of my homepage. I think that it still look
a bit simple and feel like lacking something else there. But something is in my mind already.
I will find out my 'missing thing' as soon as possible : )

2. What is Pu Erh Tea?

3. How to choose Pu Erh Tea?

4.Prepare materials for brewing Pu Erh Tea.
For this page, I'm quite looking forward and specially interested to it.
Ehm.. maybe because can put in and show some different materials which is
very cute and nice. *I hope the outcome would be niCe.*

5. Steps to brew Pu Erh Tea.

6. Pu Erh Tea Health Benefits.

7. Q & A section for Pu Erh Tea.

8. Contact us.

Finished ??

HAVEN.

I haven finish because...
You know I HAVEN... finish yet : )

^^

Moodboard for Pu Erh Tea 2

2010-05-24T22:17:00.000-07:00

This is another moodboard that I just created. Most probably is because
I'm quite not satisfy with the previous version. The first one looks utterly old-fashioned and
it makes me don't feel like facing it when go into creating website part.

For this latest version, I play around with a little bit of daily life stuff. Such as
the way how teens write diary and masking tape. I hope to link teens with this very traditional
and chinese stuff instead of just grab old people's favor.

So, how do u think?
It is much more better than previous one?

Moodboard for Pu Erh Tea

2010-05-23T14:55:00.000-07:00

Flowchart of How to Brew Pu Erh Tea

2010-05-23T13:51:00.000-07:00

How to... 2

2010-05-23T13:22:00.000-07:00

How to brew Pu Erh tea?

1. Who am I - Pu Erh tea lover
2. What is it - Pu Erh tea
3. What For - Discover more about Chinese tea and another way to enjoy life
4. 1st task - How to choose Pu Erh tea?
5. 2nd task - Stepts to brew Pu Erh tea.
6. 3rd task - Pu Erh tea health benefits.
7. Outcome - Soulmate of Pu Erh tea
8. Showcase - Gallery

How To...

2010-05-16T05:37:00.000-07:00

A. How to be a not lonely tramp ?
1. Who Am I - Tramp
2. What Is It - Travel
3. What For - Be a smart tramp and make use of strength of a tramp
4. 1st Task - Choose right activity
5. 2nd Task - Choose right food
6. 3rd Task - Record / write down something special from travel and let it become memory
7. Outcome - Time wouldn't be wasted and can spend well
8. Showcase - Gallery

B. How to live well ?
1. Who Am I - Author
2. What Is It - Life
3. What For - To create memory of life with good arrangement
4. 1st Task - Express my own feeling with words
5. 2nd Task - List target of life
6. 3rd Task - Keep meaningful photos as memory
7. Outcome - Get a wonderful life
8. Showcase - Blog/Diary

C. How to get closer to kids ?
1. Who Am I - Parents/Adult
2. Who Are They - Kids
3. What For - Create good relationship with kids
4. 1st Task - Figure out what characteristic of the kids
5. 2nd Task - Research for toys based on each kid's characteristic
6. 3rd Task - Confirm with which toy and buy it to kids
7. Outcome - Kids are very blissful
8. Showcase - Gallery

Tutorials

2010-05-14T11:08:00.000-07:00

Illustrator Tutorial

1. Stylish Vector Flower <<<>

I kinda like the pattern and effect of creating these flowers. Nice : )

2. Not as easy as it looks: A beveled star <<<>

Photoshop Tutorial

1. Easy Star Light in Photoshop <<<>

It is a pretty cool effect !!

2. How to turn your photo into movie-like effect using Photoshop? <<<>

It is like Malaysia's movie style. LOL. Unique as well ~

Beautiful Websites

2010-05-13T11:53:00.000-07:00

1. http://www.sensisoft.com/

After you go and experience this website yourself, you will understand why am I feel like shout out : ''marvelous!!'' when playing with this website : ) P.S. This is a full flash website!!

2. http://haruillust.com/

I kinda like this website because those elements inside really not bad and their concept attracts me as well. Besides, it is really very different if compare to other normal website layout nowadays.

3. http://www.silwia.weberica.net/

This is a website that the screen will scroll from left to right. It is quite special and wouldn't make me feel very hard or weird when reading this web-page : ) quite cool!

4. http://www.degt.cl/

A very nice and comfortable design for website layout. Hehe.

5. http://www.simpleart.com.ua/en/

I like this because those elements on table are click-able. ^^ And also this is a angle that
we seldom see in daily life.

6. http://www.zikadias.com

Wow!! I utterly love to play with those elements in this website. It is pretty cute and fun. ^^
Those things keep on swinging around ~ Haha. P.S. It is a full flash website too.

7. http://www.starbuckscoffeeathome.com/

Waaaah !!! I just can tell navigation of this website is very GOOD and NICE !!! Try it yourself ba.

Photo Editing of Meeeee

2009-11-03T07:08:00.000-08:00

Hohohoho. Nice ?
I can't dye. So i just imagine everyday ~
^^

Dreamy feel.
I'm lovin it !

Personally think that this effect quite interesting.
o^.^o

Original

Done DDMM & Drama class !
Yes ! Yes ! Yes !
Well done.

You Are Hot !!!

2009-10-29T08:30:00.001-07:00

Are you ?

I'm totally not.

My Colour Pallettes

2009-10-25T05:36:00.000-07:00

This is a very nice view and blue is the main colour of this picture.
The colours of the picture brings out the feeling of mystery.

This picture contains muted colour. It's simple and comfortable.

I love this picture because it is quite interesting.
The colours make me feel happy and excited too ~

It is quite cute. Colour combination make me feel like eat them !
Personal love this kind of picture.

It's green. Whole colour combination of this picture quite match too !
It brings out the feeling of hopeless. Cause the colours too dark.

Tata

I'm Not Stupid

2009-10-20T01:29:00.000-07:00

Quite familiar right ?
Hoho.

Flowchart

2009-10-12T10:27:00.000-07:00

1. Why do you want to use flowchart in your mobile interface design & screen interface design ?

As I know the purpose of doing a flowchart is primarily used to help brainstorm ideas in order to build strategies in the planning stage of any new product or company. As visual representations of the flow of data, flowcharts present key points to investors, clients, customers, business partners and employees.

But, how is flowchart link to mobile interface design & interface design ? Let's straight to the point. By creating a mobile and screen interface, we need to have planning, ideas, related information and so on. Hence, flowchart is a great way to help us gather those information and rearrange the sequences well. So that all the participants wouldn't getting confuse to the whole process of doing project like design a mobile and screen interface.

I know that a designer will draw a blueprint before construct starting construction on a building. Same to a programmer which is want to create a computer program, flowchart will be taking part the character of blueprint instead. Flowchart can helps us to follow the sequences and steps throughout a whole project.

Furthermore, flowchart also offers to clarify information, especially the complicated one. For example, we need KEY words or elements to form a flowchart, so that it is easier to discuss and brainstorm ideas.

Besides, flowchart is a diagrammatic representation. It meant to be a great way to get certain solution of a problem. Same to mobile and screen interface design. Flowchart is a must of doing a project or program because it is helpful in explaining the program to others. Just like how I'm going to explain my mobile and screen interface design to my lecturers.

2. How will it help your users to meet the interactive goals ?

I think flowchart have a magic of communication. For example, as I know the key words in a flowchart can stimulate our brain just like mind map, so my users can give any suggestion or critic to the flowchart. So that I can understand what are they thinking and what they actually demand for. Otherwise, I'm recommended to do an user-testing so that my users can successfully meet the interactive goals.

When We Are Together. ^^

2009-10-12T07:23:00.000-07:00

Who is who ? Who is who ?
Guess it. I bet u sure know ler...
Hohoho !

Waaaaaaaaaaaaaaaa

2009-10-12T07:18:00.000-07:00

Seems like after thousand years i only post up this buddy icon.

LOOks very very very smart right ? Huh ? ^^
KW ?

XW, your dream man is here. Lol.

Is Time To Open Minded

2009-10-12T06:52:00.000-07:00

This is the final outcome after my little refining.
U do welcome to leave me a comment or advise.
Terima Kasih ooo.

YA ! My EXTRA or BURDEN aeroplane and rocket GONE !
Happy with that ? Lol.
I learned not to be TOO stubborn or insisting on my favourite.

My little little pixel home looks...... cute ? ^^

This is what I Can Say

2009-10-12T06:28:00.000-07:00

A Big Thousand THANKS !

For those who help me finished my user-testing and advised me.
*My Tear...*

thank u laaaaaaaaa really !

My Icon Design . User Testing

2009-10-09T01:11:00.000-07:00

Vector Icons

Pixel Icons

Can u guys please give me some comments in my comment box ? (With clearly message)
Please be honest for your comment. Don't need scare will hurts me. ^^
Accept any comment. I do need your comment to improve and refine my icons.

My marks and final outcome is on your HANDS now !

1. Do u know what theme is my icons ?

2.The icon was (easy/difficult) to (understand/use/navigate)
A.Strongly Agree B. Agree
C.Disagree D. Strongly Disagree

3. What do you like(most/least) about the my icons ?
A.Aeroplane B. Rocket C. Colour combination D. Everything !

4. What suggestion do you have for improving my icons (Please list out) ?

5. Choose the relevant comments :
-The icons was easy to understand
-The icons was confusing
-The icons kept my interest

6.Overall is it nice ?

Kindly thanks for your user-testing.

My Glossy Icon . S

2009-10-03T09:53:00.000-07:00

Is the blue feel nice ?

Steph's Clock

2009-10-03T09:24:00.000-07:00

It is a very nice try to me.

^^

10 Things That Describe Me

2009-09-12T00:01:00.000-07:00

1 | Photography |
My D Other Half

Obviously, my D other half means the beloved D 5000.
I'm in love with photo shooting since Form 4. But it seemed getting more active after
I got myself a DSLR. This should give a big thank to my daddy. *giggle*

I found that photography can give me a special feeling. Especially it comes to
the final outcome. The moment, the scene or the memorable ones' can catch by myself
through my D is such a good feeling. I can stop any moment that impress me and let it stays in my soul forever.
It has a big difference with TIME since time flies like an arrow, we can't even stop it tho.

2 | Airplane |
My sky

| Aeroplane = Steph's Hope |

Many of my friends totally agreed the equation above.

I used to keep an eye on aeroplane since high school's life.
Don't you know that aeroplane can brings us hope and expectation ?

When there is an aeroplane pass by, it'll exactly inspire me a lot.
If you want to have a try, please stare at the aeroplane which pass by above your head
and enjoy the feeling through your small soul. You'll benefited greatly from it !

3 | Mystery . Soul |

I'm not an outgoing person.

No gathering in my life.
No breakfast but brunch.
No day & night but much more prefer all night long.
Nothing is absolute to me.
Change mind is my my expertise. ^^
Stubborn also quite related to my style.

So don't put too high expectation on me.

Don't be surprise when you see me in Euphoria or MOS.
Don't be shock when you receive my message at 5.00 am.
No doubt when you catch me reject an ice-cream.

4 | Hybernate . Polar Bear |

This is my warm and sweet room.
It is full of love inside.

That's the main reason I can hybernate for the whole season.
It will be no day and night after I stepped in.
I like the amber light very much instead of those white light.

I used to watch DVD | enjoy music | read my favourite books
inside my room. Sometimes, that's no any excuse for me to leave my room.

Hybernate is one of my way to enjoy life !
^^

5 | Humorous |

Although I am used to be very cool & cold in communicate
but what if it is with humour and jokes inside ? Hehe.

Remember don't be shock or feel weird when you see me
show out any funny and awkward poses !
Though I'm a quiet person.

Hohohohohohohohohoho !

6 | Fear Of Light |
Photophobia

I think I'm born to be the fear of light one.

I can't really accept white light unless it forced to be.
i.e. during lecture.

But, don't you think that like the light above which is the one in my room
is so warm and comfortable ?

For me,
feeling is a very important element of finish a mission.

7 | Philosophy |
Heredity

Maybe it is inherited by my daddy and brothers.
I'm in love with philosophy books since high school.

I like to read it because philosophy can inspire me a lot.
Otherwise, these are also considered as my sealed book.

I think I have to give them a big *clap* !
Cause I found that I've grow up a lot after I 'communicate' with these books. :D

8 | Laugh With A Super Duper Low Point |
No cure

My close friends will know this funny point of mine.
It's quite lame but I can't control it. *giggle*

What if you just laugh out loud when there's just a little point to laugh ?
Hehe o^.^o

9 | Persistence |
Stubborn gia

I trust that if I'm insisting on something, it'll really success.
It is also the best advantage of my stubborn attitude.
And I understand that,
Success is only reserved for people who are ready.

That's why I'm born to be the Taurus !

10 | Hoodies |
Steph's style

* Hoodies = Steph's Style *
Ngek Ngek Ngek !

I love hoodies very much. Just like how much I love photography !
I feel quite warm and trendy after I wear it.

No hoodies no life ? Hehe.
I love deep blue also !