Posts Tagged ‘User Interaction’
We are pleased to present below all posts tagged with ‘User Interaction’.
We are pleased to present below all posts tagged with ‘User Interaction’.
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.
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...
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.
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:
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.
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...
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.
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 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.
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...
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.
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...
Good user interfaces are crucial for good user experience. It doesn't matter how good a technology is — if we, designers, don't manage to make user interface as intuitive and attractive as possible, the technology will hardly reach a breakthrough. To gain the interest in a new product or technology, users need to understand its advantages or find themselves impressed or involved.
And here is where creative ideas and unusual interface approaches become important. Innovative doesn't mean usable and usable hardly means innovative. As usual, it's necessary to find an optimal trade-off. And some user interfaces manage to achieve just that.
Below we present 10 recent developments in the field of user experience design. Most techniques may seem very futuristic, but some of them are already reality. And in fact, they are extremely impressive. Keep in mind: they can become ubiquitous in the next years.
You may also want to take a look at the related posts:Read more...
Consistency. The whole OS and almost every application looks and feels the same, as if a single team developed the whole thing, thanks to Apple HI Guidelines. Official guidelines for user interface design made it possible for users to actually use most Mac-applications in a very same way, creating a seamless and comfortable experience in the end. Users are able to anticipate how system behaves and what to expect from its applications. In fact, consistency dramatically improves learnability and usability of interacting with the system.Read more...
In 2000 Apple released the visual theme Aqua, a stunning leap forward in graphical user interface design. At the same time Apple published the Human Interface Guidelines (HIG), a tool for developers and designers that gives a detailed breakdown of the design philosophy behind Aqua. Apple recently updated their Human Interface Guidelines (HIG) to include the way the visual theme Aqua has evolved in Apple's latest operating system, OS X 10.5 Leopard. This is the first update since 2006.
Let's take a look at how this affects icon designers.
To get really beautiful icons, Apple recommends that you let a professional designer create your icons. Despite all the eye candy and realism that is possible to apply to icons, less is more. Strive for a simple solution using one easily recognisable object. The basic shape or silhouette of your icon can help users to quickly identify it.Read more...
Although usability evangelists often consider Flash to be a usability nightmare, used properly, Flash can provide users with a rich and interactive interface which would be impossible otherwise. Today Flash is the de-facto standard for interactive elements on the Web as most users install Flash plug-in by default. And in fact, there are many paths creative designers can take to create a more interactive and user-friendly interface.
Searching for 'flash tutorials' via Google & Co. won't provide you with the results you expect. Not that you won't find any relevant results, on the contrary — you will be directed to a large number of Flash repositories which offer everything: sometimes useful, but mostly not. Besides, browsing through these repositories isn't that much fun — as you sometimes need to figure out whether a link you see is a hidden AdSense-block or the actual tutorial. And it's really hard to find something "refreshing" and new simply using some standard keywords.
This article provides hand-picked professional Flash tutorials which can enrich your design skills and improve the quality of your works. We've tried to select most interesting and useful tutorials. Most sources can serve as the entry point for further tutorials.Read more...