5 Ideas To Help You Become Better Web Designer

Posted in Web Design4 years ago • Written by 26 Comments

Web design, like every other form of design is ever-changing! Web designers thus need to be updated with the latest trends to be able to design creative websites. Web design has seen the emergence of new trends and new ideas in last few years. There was also the addition of website interactivity to web design. Newly designed sites are inclined towards displaying their content in an interactive way. Their focus while designing websites is beyond a creative canvas; it is more about attracting users and getting a user engaged on the site.

To understand and use these concepts, we can take a look at some of the most common design ideas to watch out for in the coming days. These highlight some important tips with examples that can be used for web design. I am sure, many talented designers are already aware about these tips; however, one tends to overlook them!

Use of attractive graphics and displays

There are many websites that stand apart from the rest. A web designer can use a creative layout and concept to attract users. This helps to capture the initial attention of users. Yet, one can never be sure whether it keeps a user on the page for a good amount of time to convey the intended message. In this case, website interactivity can help to engage users on a page. Users stay on a page when we provide them some actions to be performed to explore a site rather than providing simple text-based content. Using interactivity on a website helps to capture initial attention of users along with presenting information in a way which encourages user to perform desired action on the page.

For example, a product website can include quotes from customers that lend authenticity to a website. This gains faith from users. A common way to display the customer testimonials is through the use of quotes with the name and designation of the customer. Though the product has many good customer testimonials, this display cannot guarantee to capture the attention of the users. Instead, an interactivity that displays the quotes and customer photographs is surely an attention-grabbing idea. It would not only present the content in an engaging manner through the creative use of flash interactivity; but also give a personal touch to the existing customers which would encourage other customers to have their testimonials out there.

Wrangler

Wrangler Site

Another great example of engaging users to explore the website is Wrangler’s site. We all know about the popularity of the brand Wrangler. This website displays the products in a very unique way. It engages user to perform actions like unzip the jacket, drag a shirt to view the shirt design, etc. to browse the website further. The visuals then unfold in a very interesting manner. The collection can be viewed only after the user performs some action on the website!

A website can even enhance its display in a unique manner to connect with the users.

This website has made a creative combination of interactivity and animation to present information about the company. Buzz, the integrated design studio has displayed each and every section about the website in a unique interactive way. With every click, the animated figures amuse users while presenting the information.

Jim Carrey

Jim Carrey is a personality who needs no introduction. His website also reflects his unique, creative talent. There is an interesting use of displays in terms of photographs and forms.

The use of interactivity is done cleverly as with each click, something new unfolds on the page. To know more, you must explore it yourself!

So, have you already started thinking of something unique and different to allow users to explore your site? Well, just hold on a second! This is just the start. Read further to explore few more design trends which are picking up :)

Enhancing the common elements

It is also seen that creative websites have a great emphasis on color and layout. This means that there are many elements that may not even get that much attention, such as a site map that is not always presented in a creative way.

We can take another example which will highlight why one needs to enhance these finer elements on a website. A normal site map that is seen on most sites contains details in a text and link format.

The trick is to break away from this tradition. Present the site map details in a creative way with images and interactivity to make a user want to view the site map.

I am sure that there is no one here who does not know about J.K.Rowling and her famous Harry Potter series. Have you ever explored her site? Her site is also as creative as her Harry Potter books. Check out a screen shot of her website below.

JK Rowling

The website contains a visually appealing layout as seen in the example. The elements that are spread out are keys to the site map. There is the use of many interactive features which contain details about the site.

The tabs such as Biography, Wizard of the Month, Tales of the Beedle and the Bard and even the contact tab are used very creatively into this layout.

Nike

In this website, one can witness a creative usage of product display. The product features are shown in a unique manner rather than the typical forms of layout.

The central portion can be moved around with a cursor which changes the placing of the light to display the various features of the product.

Dior

Dior is a brand that has a large fan-following. Their website itself reflects the exclusivity of the brand. This example showcases different Dior perfumes with a creative touch. Instead of showing the products in a regular manner, there is an interesting display of the fragrances.

The setting is quaint and makes a user want to explore the website further. The different elements are highlighted with the use of color and interactive elements.

Have you ever observed this kind of trend before? If not, start looking around. You would definitely find many such creative site maps.

Induce action from users

Even when a website is creatively designed, the final aim of the website is to make a user perform a desired action on the page. This action could be to register for a free trial or enquire about a service. This is when a web designer needs to think, ‘what next?’ to move on to the next level.

If you have a website which thrives on advertisement revenue, then it is quite probable that the page would have many advertisements. In such cases most of the advertisements fail to capture user attention in the crowd of advertisements. These become a blind spot for most of the users. This is when website interactivity can be used to capture the attention of the users.

You might be thinking how can interactivity helps in advertisements? Well, I have already said that now we need to think creatively! And nothing is impossible in the world of creativity! :)

Instead of having a plain banner, a user can be attracted to view it by having the banner designed as peel-off interactivity. This means, a user needs to peel off the first layer to reveal the message beneath. It can be very effective particularly for a teaser campaign.

Imagine your first layer of peel-off says “Please don’t look beneath me! It would be difficult for you to resist the offer!” Don’t you think a user would have an urge to see what is beneath? Definitely, at least I will! Once the user peels off the banner, it sees the actual advertisement of the offer or the service.

I Make My Case

Mobile phones are a rage and everybody is on the lookout for an exclusive design. This example is about a website where one can create one’s own design and order for a mobile case based on the design. Therefore, this website uses interactivity to display the same.

All a user needs to do is click to select graphics, colors, etc. to create a mobile case of his/her choice. This is a unique idea to engage users whilst they try new designs and highlight the company profile.

Design Embraced

This website showcases works of an interactive designer. The portfolio can be viewed by clicking and dragging, which makes a user perform an action on the page. The presentation is sleek which adds to the aura of the designer.

Engage users whilst they perform an action

There are numerous websites which provide various services for different kind of users. For example, if you go to a shopping website, there are all kinds of things which are sold on such sites. The website design for such topics may not direct users to appropriate items they are looking for.

A user may not have time or patience to look through various categories and find out the required information.

For example, a photography website can have tabs such as nature photography, useful cameras for nature photography, wildlife photography, etc. If these elements are presented together, it can make a user visit all the tabs in search for information.

A user thus gets engaged whilst referring to these tabs and is motivated enough to perform an action.

Let us look at a website which has used interaction to its best to showcase its summer and fall collections. Its collection is displayed through the circular leaf design on a plant.

Extre

Won’t you like to go through the complete collection by clicking its various circular leaves? This is a unique way to engage users to encourage them to go through the complete new collection! Isn’t it?

FNN

This website is creatively designed to bring about an interest amongst users to explore it further. Here, the F&N product flavors can be viewed with mere clicks. As a user clicks the can, the different flavors are revealed with each click. This turns out to be an engaging factor for users whilst the product information is shared.

Adding Interactivity to Websites

After reading through the above points you would have definitely agreed that interactivity is the way to achieve your aims for website design.

Interactivities are just great and they add the “WOW” factor on your website. But creating such interactions would take months and we don’t have that much time on hand, isn’t it? Well, then I have some good news to share with you!

My experience as a web designer states that creation of such interactivities does not take months and also do not require knowledge of Flash. If I tell you that adding interactions to your website can be done in minutes and without any programming, would you believe me?

I know some good software tools such as Raptivity Web Expert which allows creation of interactivities using simple wizard-based customization. This completely eliminates the time spent in programming!

By paying close attention to websites, one can fine great samples of interaction which would engage you and make you think that web design is no longer a simple HTML page but a canvas which can be painted creatively and differently! Do you know any such creative website? Do share them in the comments below.  I would love to hear from you!

2 Written ArticlesWebsite

Poonam works as Product Manager at Harbinger Knowledge Products and looks after Raptivity Web Expert, software to bring web pages alive through Interactivity. This software helps to add interactivity to websites without programming! She holds a Bachelor’s degree in Computer Engineering and is an active blogger (http://raptivitywebexpert.blogspot.com)

26 Comments Best Comments First
  • Pooja

    Saturday, May 8th, 2010 12:39

    2

    Hi,

    I like your post.It is very good information for web designer.

    Thanks a lot sharing this information with us.

    +1
  • Jasmyn

    Thursday, May 13th, 2010 20:46

    9

    Definitely a great list to keep handy! Thanks for the refresher!

    0
  • James

    Saturday, May 8th, 2010 15:58

    1

    Good article, although there’s a lot of sites that are interactive that don’t rely on Flash but use JavaScript instead to handle effects etc. What with the iPad and iPhone this is important to think about before jumping into Flash based sites.

    Cheers,

    James

    0
  • bobin

    Sunday, May 16th, 2010 08:32

    10

    Worth reading , thanks for sharing..

    0
  • AdRiCe Design

    Monday, May 17th, 2010 20:36

    11

    Really good points and it’s nice to see that you have gone into detail for each one. Great post

    0
  • Dan Smart

    Tuesday, May 25th, 2010 16:55

    12

    I appreciate the work you’ve put into this blog post, however I would have to disagree with most of your examples, as although interactivity can draw people into a site, one of the things that pushes them away is a lack of usability, and lack of clarity over ‘where should I click’. In terms of leading someone to making a purchase, we do not want to be pushing people away from the site by confusing them.
    Though I am all for pushing the boat out and trying something exciting, sometimes these interactive designs can become an expensive toy for the owner/designer, rather than drawing people in. The most important information should be the easiest to find, and then there’s perhaps a place for more interactive elements with some good explanation of what to do, though the best designs are self explanatory.

    0
  • Christopher Ross

    Wednesday, May 12th, 2010 12:44

    8

    Great post, this is fantastic information for any web designer. Thanks!

    0
  • Ted Thompson

    Tuesday, May 11th, 2010 13:54

    7

    Great article! Thanks for sharing.

    0
  • DRX-DEsign

    Saturday, May 8th, 2010 13:58

    3

    Amazing
    I like your post.It is very good information for web designer.

    Thanks

    0
  • Rob T

    Saturday, May 8th, 2010 22:01

    4

    That JK Rowing site is sweet

    0
  • Cliff

    Sunday, May 9th, 2010 23:41

    5

    Inducing action and enhancing common elements should be used with caution and discretion. Function and usability always comes first – depending on what type of website it is, usability and function may be hindered through complex designs that overshadow navigation tools, or if inducing action takes away time and may deter users.

    Overall, great article!

    0
  • McConnell Group

    Monday, May 10th, 2010 15:14

    6

    An Increase in the Interactivity of a website will also reduce your bounce rate from that page.

    These are some great ideas to help

    Thanks,

    Shawn

    0
  • aki

    Sunday, June 6th, 2010 19:14

    13

    There’s some interesting site you show there. Definitely a good example for better idea in designing. But maybe efficiency should be taken, looking into the site with many interactive features, could take so long to load, for example Jim Carrey site, taking some time to load the content after I’ve click the News. Nevertheless, a wonderful idea and were presented perfectly

    0
  • Suraj shrestha

    Monday, August 2nd, 2010 07:57

    14

    Really nice content. Thanks for sharing.

    0
  • wariat777

    Monday, July 11th, 2011 22:49

    22

    I am sorry, but I have to disagree.
    I have to agree to one point though – Websites has to invite users with interactivity, colors, beautiful designs but these examples are not worth mentioning, because what i personally think Flash is not a real “web design”, but sort of computer interactive animation (and not the best one), because it “eats” hell of a lot resources (for example wranglers website need so much processing power that it lags drastically on my 2.2 Ghz dual core processor). The thing is that this is the simplest method for “artistic brains” which are usually not too good in any programming language which is out there ready to use for REAL web designers.

    Creating Flash animation is just creating flash animation because you can put it into web doesn’t mean that this is web site (after all you can insert a movie into the web ass well and it isn’t called “Web design” isn’t it ?
    … Ha – You can even make it interactive by attaching links inside the movie which will take you to another movie (isn’t it similar to something ?).

    Because people misleading web design and animation these kind of “beautiful” monsters happen to exist all over the Internet and are forcing me to download hundreds of MB.

    It’s just animation (*onclick) another animation or action – simple as this

    So here is my request for all of you “artists” – Please stop calling Flash animations a web design !

    0
  • Valt

    Monday, November 28th, 2011 18:25

    23

    I like post.It is very informative and descriptive for web designer.
    Thanks a lot sharing this information with us.

    0
  • Frinley

    Sunday, January 29th, 2012 17:13

    24

    Nice article. Of course this is a good reference for all web designers. Good job! Thanks again.

    0
  • Joint Medias

    Thursday, April 5th, 2012 14:35

    26

    Jim Carrey is a bizzarre man, and his website is no different!

    0
  • Patrick F.

    Friday, March 30th, 2012 19:47

    25

    Great article. You definitely point out the commitment that it takes to your clients. I’m still in school yet but trying to learn as much as I can before I graduate web design/development.
    I linked you on my “webography” (Resource 2). I thought your content warranted the recognition. Keep up the great writing.
    Patrick

    0
  • Glen

    Monday, May 23rd, 2011 15:54

    21

    I love the suggestion, you’re right, having attractive images attracts more users to check your site, but sad to say not everybody can design such images. But if you can’t do it yourself and have have some extra money to spend, much better, the potential of getting more visitors to say in your site longer is big.

    0
  • Kiran

    Friday, May 13th, 2011 12:55

    20

    Good effect to forward to learn the web designer from you……thanks Ms.Poonam

    0
  • PPC

    Thursday, August 5th, 2010 12:02

    15

    Great points, thanks for the heads up. Always looking to sharpen the skills!

    0
  • Rupnarayan Bhattacharya

    Monday, August 9th, 2010 09:40

    16

    Great collections and points no doubt. I fully agree that the best way to engage a user in website is to interact. But in case of flash based sites one very common problem is the loading time. The user really become impatient if the loading time is more than a minute. There is a big possibility that the user will go away because of a lengthy loading time. That is why some sites are giving some simple games to play while the site actually loads. Any other suggetions on how to engage the user in loading period?

    0
  • satya

    Wednesday, September 29th, 2010 14:13

    17

    Nice design collections.It’s really helpful for all designers.

    0
  • Ned

    Thursday, May 5th, 2011 08:30

    19

    The idea of engaging the users whilst they perform an action is something I will definitely try in my future web development projects. Thank you for sharing this wonderful article.

    0
  • Tatang Satya

    Sunday, February 6th, 2011 16:38

    18

    Great Design Examples for Web Idea

    0
  • Joint Medias

    Thursday, April 5th, 2012 14:35

    26

    Jim Carrey is a bizzarre man, and his website is no different!

    0
  • Patrick F.

    Friday, March 30th, 2012 19:47

    25

    Great article. You definitely point out the commitment that it takes to your clients. I’m still in school yet but trying to learn as much as I can before I graduate web design/development.
    I linked you on my “webography” (Resource 2). I thought your content warranted the recognition. Keep up the great writing.
    Patrick

    0
  • Frinley

    Sunday, January 29th, 2012 17:13

    24

    Nice article. Of course this is a good reference for all web designers. Good job! Thanks again.

    0
  • Valt

    Monday, November 28th, 2011 18:25

    23

    I like post.It is very informative and descriptive for web designer.
    Thanks a lot sharing this information with us.

    0
  • wariat777

    Monday, July 11th, 2011 22:49

    22

    I am sorry, but I have to disagree.
    I have to agree to one point though – Websites has to invite users with interactivity, colors, beautiful designs but these examples are not worth mentioning, because what i personally think Flash is not a real “web design”, but sort of computer interactive animation (and not the best one), because it “eats” hell of a lot resources (for example wranglers website need so much processing power that it lags drastically on my 2.2 Ghz dual core processor). The thing is that this is the simplest method for “artistic brains” which are usually not too good in any programming language which is out there ready to use for REAL web designers.

    Creating Flash animation is just creating flash animation because you can put it into web doesn’t mean that this is web site (after all you can insert a movie into the web ass well and it isn’t called “Web design” isn’t it ?
    … Ha – You can even make it interactive by attaching links inside the movie which will take you to another movie (isn’t it similar to something ?).

    Because people misleading web design and animation these kind of “beautiful” monsters happen to exist all over the Internet and are forcing me to download hundreds of MB.

    It’s just animation (*onclick) another animation or action – simple as this

    So here is my request for all of you “artists” – Please stop calling Flash animations a web design !

    0
  • Glen

    Monday, May 23rd, 2011 15:54

    21

    I love the suggestion, you’re right, having attractive images attracts more users to check your site, but sad to say not everybody can design such images. But if you can’t do it yourself and have have some extra money to spend, much better, the potential of getting more visitors to say in your site longer is big.

    0
  • Kiran

    Friday, May 13th, 2011 12:55

    20

    Good effect to forward to learn the web designer from you……thanks Ms.Poonam

    0
  • Ned

    Thursday, May 5th, 2011 08:30

    19

    The idea of engaging the users whilst they perform an action is something I will definitely try in my future web development projects. Thank you for sharing this wonderful article.

    0
  • Tatang Satya

    Sunday, February 6th, 2011 16:38

    18

    Great Design Examples for Web Idea

    0
  • satya

    Wednesday, September 29th, 2010 14:13

    17

    Nice design collections.It’s really helpful for all designers.

    0
  • Rupnarayan Bhattacharya

    Monday, August 9th, 2010 09:40

    16

    Great collections and points no doubt. I fully agree that the best way to engage a user in website is to interact. But in case of flash based sites one very common problem is the loading time. The user really become impatient if the loading time is more than a minute. There is a big possibility that the user will go away because of a lengthy loading time. That is why some sites are giving some simple games to play while the site actually loads. Any other suggetions on how to engage the user in loading period?

    0
  • PPC

    Thursday, August 5th, 2010 12:02

    15

    Great points, thanks for the heads up. Always looking to sharpen the skills!

    0
  • Suraj shrestha

    Monday, August 2nd, 2010 07:57

    14

    Really nice content. Thanks for sharing.

    0
  • aki

    Sunday, June 6th, 2010 19:14

    13

    There’s some interesting site you show there. Definitely a good example for better idea in designing. But maybe efficiency should be taken, looking into the site with many interactive features, could take so long to load, for example Jim Carrey site, taking some time to load the content after I’ve click the News. Nevertheless, a wonderful idea and were presented perfectly

    0
  • Dan Smart

    Tuesday, May 25th, 2010 16:55

    12

    I appreciate the work you’ve put into this blog post, however I would have to disagree with most of your examples, as although interactivity can draw people into a site, one of the things that pushes them away is a lack of usability, and lack of clarity over ‘where should I click’. In terms of leading someone to making a purchase, we do not want to be pushing people away from the site by confusing them.
    Though I am all for pushing the boat out and trying something exciting, sometimes these interactive designs can become an expensive toy for the owner/designer, rather than drawing people in. The most important information should be the easiest to find, and then there’s perhaps a place for more interactive elements with some good explanation of what to do, though the best designs are self explanatory.

    0
  • AdRiCe Design

    Monday, May 17th, 2010 20:36

    11

    Really good points and it’s nice to see that you have gone into detail for each one. Great post

    0
  • bobin

    Sunday, May 16th, 2010 08:32

    10

    Worth reading , thanks for sharing..

    0
  • Jasmyn

    Thursday, May 13th, 2010 20:46

    9

    Definitely a great list to keep handy! Thanks for the refresher!

    0
  • Christopher Ross

    Wednesday, May 12th, 2010 12:44

    8

    Great post, this is fantastic information for any web designer. Thanks!

    0
  • Ted Thompson

    Tuesday, May 11th, 2010 13:54

    7

    Great article! Thanks for sharing.

    0
  • McConnell Group

    Monday, May 10th, 2010 15:14

    6

    An Increase in the Interactivity of a website will also reduce your bounce rate from that page.

    These are some great ideas to help

    Thanks,

    Shawn

    0
  • Cliff

    Sunday, May 9th, 2010 23:41

    5

    Inducing action and enhancing common elements should be used with caution and discretion. Function and usability always comes first – depending on what type of website it is, usability and function may be hindered through complex designs that overshadow navigation tools, or if inducing action takes away time and may deter users.

    Overall, great article!

    0
  • Rob T

    Saturday, May 8th, 2010 22:01

    4

    That JK Rowing site is sweet

    0
  • DRX-DEsign

    Saturday, May 8th, 2010 13:58

    3

    Amazing
    I like your post.It is very good information for web designer.

    Thanks

    0
  • Pooja

    Saturday, May 8th, 2010 12:39

    2

    Hi,

    I like your post.It is very good information for web designer.

    Thanks a lot sharing this information with us.

    +1
  • James

    Saturday, May 8th, 2010 15:58

    1

    Good article, although there’s a lot of sites that are interactive that don’t rely on Flash but use JavaScript instead to handle effects etc. What with the iPad and iPhone this is important to think about before jumping into Flash based sites.

    Cheers,

    James

    0

Comments are closed.

54.211.47.170 - unknown - unknown - US