Posts Tagged ‘User Interaction’

We are pleased to present below all posts tagged with ‘User Interaction’.

9 Crucial UI Features of Social Media and Networking Sites

The main function of a good user interface is to provide users with an intuitive mapping between user's intention and application's function that manages to provide a solution to the given task. Basically, user interface describes the way people interact with a site and the way users can access its functions. In fact, usability is a biproduct of a good user interface and it determines how easily a user can perform all of the functions provided by the site. Usability is a crucial part of every design, especially on websites with a large amount of functions and users.

Screenshot

This article goes over crucial features of the user interfaces of social media and social networking sites. It discusses important features, techniques and concepts behind these designs and explains why they are important, with examples from top sites. These easy and general usability strategies can be applied almost anywhere and to almost any type of user interface.

You may want to take a look at the following related posts

Read more...

Modal Windows In Modern Web Design

Web design is essentially the organization of information into a readable, usable, functional and accessible format. Good organization of content is crucial, and you need a strong layout that you can build a website upon. You can use numerous interface elements and structures to organize content, such as jQuery-based content sliders and modal windows, which are basically windows that float above the page.

Screenshot

The modal window has many advantages. For example, when a modal window contains a smaller element, the user doesn't need to load an entirely new page just to access it (another way to achieve the same effect is e.g. by using AJAX-based tabs). By providing modal windows, you improve the usability of your website. Having to load pages over and over will annoy most users, so avoiding that is definitely a good thing. Modal windows also allow you to save space by getting rid of large elements that don't need to be on the main page. For example, rather than putting a full video on a page, you can just provide a link, thumbnail or button of some sort.

In this article, we'll go over best practices and trends for working with and building modal windows. We'll also provide numerous examples of well-constructed modal windows and a few scripts to get you started with building them.

Read more...

8 Layout Solutions To Improve Your Designs

The organization of content is probably one of the most important and influential aspects of any good web design. Organizing information into a well-built layout is the basis of a website, and should always come before styling concerns. Without a good layout, the website doesn't seem to flow correctly, and nothing connects the way it should.

Screenshot

In this article, we'll discuss 8 useful layout solutions and techniques that will help you create a clean and organized content layout. The 8 techniques include sliders, tabs, progressive layouts, structured grids, modal windows, rollover elements, accordions and mega drop-down-menus.

You may also be interested in the following related posts:

Read more...

Designing The Holy Search Box: Examples And Best Practices

On content-heavy websites, the search box is often the most frequently used design element. From a usability point of view, irritated users use the search function as a last option when looking for specific information on a website. If a website's content is not organized properly, an efficient search engine is not only helpful but crucial, even for basic website navigation. In fact, search is the user's lifeline to mastering complex websites. The best designs offer a simple search box on the home page and play down advanced search and scoping.

Screenshot

Search box

Search box

In practice, websites tend to grow over time, adding new content and, more importantly for us, adding new navigation options, such as additional content sections. However, these new content islands do not necessarily fit the whole information architecture that was well-designed and thoroughly structured when the website was initially designed. The consequence is a poor navigation scheme that is more irritating than helpful, because the content appears to be scattered all over the place instead of contained in separate, very distinct folders (in fact, this is a problem we encountered here at Smashing Magazine recently).

Read more...

Creative User Interfaces in Modern Web Design

The whole may be more than the sum of its parts, but without the parts, there is no whole. Lest that sound like some weird philosophical meandering to you, take comfort in observing the finer aspects of creative and appealing user interface design.

OkayDave by you.

The following list bucks tradition by not being tied to one particular theme; although, as you’ll see, there are subtle threads running through them. While excellent, none of these designs are perfect, and I’ve pointed out room for improvement we can learn from.

Give it a go. Grab a coffee and take time to explore further. As you would a quality timepiece made of thousands of parts, analyze and enjoy how intricate parts come together to create a cohesive experience. Look closely and see what makes each website design tick.

You may also want to take a look at the following related articles:

Read more...

Pricing Tables: Examples And Best Practices

Pricing tables play an important role for every company that offers products or services. They are a challenge from both a design and usability standpoint. They must be simple but at the same time clearly differentiate between features and prices of different products and services.

ConceptShare Price Table

A pricing table should help users pick the most appropriate plan for them. A company should carefully examine its product portfolio and pick the most important features to present in its pricing plans. Visitors should be given only the information they would be interested in: available features, options and costs. The rule of thumb is: every unnecessary cell in your pricing table increases the probability of losing potential customers, because you make it more difficult for them to compare various plans and select the best one.

Once you have identified the most important features, go ahead and create a more detailed list of features for users who are interested in a particular plan. Users must know what kind of a product they are spending their money on and all of the features associated with it.

Read more...

The <hr>-Contest Results – Download your fresh <hr>-line now!

Three weeks ago we have encouraged our readers to participate in our <hr>-contest by designing beautiful and creative horizontal lines. It was necessary, since this design-element was slowly disappearing and was often neglected in web design. But it is going to change now. We have received 1290 images and source-files from 384 designers across the globe. The result is an impressive collection of horizontal lines that designers can use for free without any restrictions whatsoever.

hr-line

hr-line

hr-line

Many entries contained not only images, but also source-files, mostly for Photoshop or Illustrator. You can use them if you want to modify a design for your projects. For this purpose we packed these files in one .zip-archive with all source-files (109 files, 25 Mb). Of course, it would be better to provide the link to a .zip-package next to each of the designs presented below, but it would take many hours of work which we can actually use in a more effective way. We can not guarantee that all images in the .zip-package are correct as we haven't tested all of them.

Unfortunately, some entries could not be considered for the contest. They didn't meet our requirements, were too big or unusable. It was important for us that these files could be used in projects beyond the scope of our contest.

Read more...

↑ Back to top