- Flash
- Windows
- Flip
- Conventional-1
- Abstract
- Conventional-2
- Squares
- Intl
- Lorem Ipsum
|
Flash Demos
The following links and demos are provided as demonstrations of a number of Flash-based websites. Each one is unique, yet they all provide very similar content. While these websites are intended primarly for informational and/or instructional use, they also provide insight into what is possible with Flash.
The most appealing aspect of Flash-based sites is that they are 100% compatible with ALL modern-day web browsers and will appear exactly the same in each one. What that translates to is a "write-it-once-and-forget-about-it" approach to website development. It isn't necessary to test or debug a Flash site on the wide assortment of modern-day web browsers currently available, because if it looks good in one of them, it will look good on them ALL. You don't have to apply MSIE specific fixes to these sites, because the Flash "engine" is common throughout all browsers.
The end result is that while the initial design may take longer to create than a conventional website, there is no "tweaking" of the code to make it compatible with all the browsers. Once the design is completed and the site is up and running, you can basically forget about it and simply let it do its thing (so to speak).
The only down-side to Flash-based sites is that the content cannot be indexed by search engines. This is due to the fact that the site itself is comprised of a single SWF (Shockwave) file, which is not in textural format (it is binary). While this makes it a bit more difficult to optimize a Flash site for search engines, there are many other techniques that can be employed to increase your page ranking and ultimately drive more visitors to your site.
|
|
Windows
This site demonstrates a windowed user interface.
Click the link to start this demo and a new page, tab or window will open. When the flash content finishes loading, you'll see a small window in the upper left corner with a blue crown centered in it. Move your mouse cursor over the crown and a small menu with three icons will pop out to the right.
The top icon, when clicked, pops up the main menu interface, from which you can open additional windows (with content). This menu automatically scrolls up and down, depending on where you place your mouse cursor.
The second (middle) icon, when clicked, pops up a small picture viewer window with a sliding (right-to-left/left-to-right) row of thumbnails. Click a thumbnail and an enlarged version of the picture will appear in a window.
The third icon pops up an MP3 music player, with fairly standard controls you should be familiar with. To close any of the windows (except for the main window), simply click the small 'X' in the upper right hand corner of each window.
The unique feature of this interface is that you can click on the frame (for a window with content) or an image, in the case of the image viewer, and move the windows around and arrange them in whatever order you prefer, just like a windowed operating system. You can drag window off to the side, top or bottom and generally interact with the user interface in the same manner you would with just about any window-based operating system. Very unique and simple to navigate.
|
Page Flip
This site demonstrates a "flipping page" user interface, which is rather unusual and unique. The menu arrangement is fairly standard and should be easy for your visitors to figure out and navigate.
You'll notice that when you put your mouse cursor over one of the main menu items, an animated "strap" will swing around to cover the menu item selected, which is rather unconventional yet fairly typical of Flash content. Flash is all about motion and animation effects and is designed, primarily, to grab your visitor's attention.
When you click one of the main menu titles, you'll see the "flipping" effect as the entire page rotates 180 degrees (horizontally, front to back). To return to the main page (Home or Default), click the 'Solutions' logo at the top of the page.
While this user interface is rather unconventional, in terms of the animation effects used, its layout and main menu arrangement is fairly conventional. As such, your visitors will be comfortable with it fairly quickly, as well as entertained.
This is a good example of what Flash is all about. Flash and the Flash Player is a multimedia platform currently developed and distributed by Adobe Systems. Since its introduction in 1996, Flash has become a popular method for adding animation and interactivity to web pages. It is commonly used to create animation, advertisements, and various web page components, to integrate video into web pages, and more recently, to develop rich Internet applications and content.
|
Conventional #1
This site demonstrates a fairly conventional looking user interface, with the main menu at the bottom. This type of interface is easy for your visitors to navigate and can be applied to a variety of business models. This one is photography site for people who are interested in either selling their photos or simply letting people view them.
What you should notice about this site is the row of thumbnails at the top right portion of the main page. This menu slides back and forth and when you click one of the thumbnails, an enlarged version of the image appears in the main window. These images then become, in effect, the background image for the main page, as well as the sliding content that appears when you click one of the menu buttons.
As you click through the main menu, you'll see panels containing content slide from left to right and over the background image. The panels consume approximately two thirds of the page, while still allowing your visitors to see a portion of the background image. This effect can be useful for describing either the subject of the photograph, the camera and the settings used to take the picture, the purchase price and/or any other information that might be suitable.
This is an attractive and easy to navigate site and can be applied to many business types (not just photography). Products or service related images can be used and the sliding panel can contain information about those products or services, which makes it a very flexible design.
While it may not be as "Flashy" (no pun intended) as some of the other site demos, it is very clean, easy to navigate and will keep your visitors engaged.
|
Abstract
This site is very unusal and somewhat abstract. The type of user interface presented in this demo is best suited for artistic or unusual content and should be geared more toward art and/or a photography related business or any business that deals in the abstract or unusual. The user interface, while certainly unique, is very unusual and as such, should be used only where artistic license provides the setting for related subjects and content.
When the page loads, you'll see a black dot float down from the top of the window. When the dot stops moving, click it and the main user interface will appear. The main user interface consists of a rather abstract looking tree with eyes at the ends of four of the branches.
The eyes move around with no input from the site visitor, but and when your mouse cursor gets within a few pixels of one of the eyes, it (the eye) starts to follow your cursor around, as you move it. Some people find this a bit creepy while others find it very entertaining. This is a highly subjective user interface that effectively demonstrates many of the capabilities of Flash.
You will also notice a red logo/icon in the upper left corner. This icon (looks like a curled tree) will return you to the main user interface when clicked. You can also click one of the eyes to return to the main page. While this site is not for everyone, it does demonstrate what is possible with Flash.
That is the purpose of these demos; to show what Flash is all about and how it might work for your business, your products or services and how it can be used to effectively present your business, in an entertaining and engrossing manner, to your site visitors.
|
Conventional #2
This site demonstrates another fairly conventional user interface, with the main menu on the left, as well as some fairly interesting effects. This type of user interface is easy for your visitors to navigate and can be applied to a wide variety of business types.
What you'll notice immediately are the eye-catching Flash effects on the main menu. Grabbing your visitor's attention is what Flash effects are all about, and these are pretty good ones. You'll also notice that when you click one of the menu items, the content that appears is presented using another interesting effect. A line is drawn around the content container (where your content will appear) and the name of the page appears in the background, just before the content is displayed. Yet another Flash effect designed to grab your visitor's attention.
While most people find Flash effects interesting, and they do indeed grab their attention, some people simply don't like them or can't appreciate the technical or artistic apsects of the work and effort that goes into creating them. They do have their purpose though and the end result is to draw attention to your content and to keep your site visitors entertained.
Flash is one of the best ways to do that and is an effective tool for creating a user interface that is engrossing and holds your visitors attention. Whether or not your content and business model might benefit from Flash is a question only you can answer.
|
Squares
This is another somewhat conventional site, in that there are no weird looking trees or eyeballs following your cursor around the screen. What it does have though is a very nice and colorful user interface that consists of a row of squares in shades of blue (somewhat of a gradiant effect).
Each square, when you hover your mouse cursor over it, drops down and displays the title of the page that will pop up when you click it. You can either click the square that drops down or the space it occupied (above the square when it drops down). A very unusual yet attractive interface that most people seem to like.
The far left gray square is the 'Home' page square and will collapse the menu and hide the last window opened when clicked. The advantage to this site is that the content containers (windows) can contain just about any type of content you'd want. They are also expandable, as is the menu itself, and the look and feel of the entire site presents a very uniform and precise user interface.
With that in mind, it would be perfect for an architect, artist, interior decorator or any business that deals in precise specifications or numbers. Try it and see what you think.
|
International Site
When your business attracts customers from all over the world, why not show the world a site that reflects your market? This Flash website example utilizes a world map as its background, and when you're on the home ('Welcome') page, it scrolls from left-to-right. This site is very angular and hi-tech in its appearance, which is perfect for any business involved in hi-tech industries.
While this website doesn't have a huge assortment of 'flashy' effects, it offers a very clean and easy to navigate user interface. That alone makes it attractive, because the easier and less confusing a site is to navigate, the more your site visitors will like it.
One of the things people like about this site is that you can place your mouse cursor over the scrollable content and use the scroll wheel on your mouse to scroll the content up and down. This is a very handy feature and makes for a seamless presentation of your content. The color pallet used in this site is also very attractive and again, simplistic.
The fewer the number of colors used on a site, the more visually appealing your site will be to your visitors. Keeping things simple, as well as engrossing, is the key to attracting more visitors. The more applealing your site is, both in terms of visual content and user interface design, the longer your visitors will stay on your site and the greater your odds of making a sale.
|
Lorum Ipsum
You may have noticed several instances of "Lorum ipsum ..." on this site, and especially in the Flash sites. Just in case you were wondering what it all means, this is an explanation of where it came from.
In publishing and graphic design, "lorem ipsum" is the name given to commonly used place holder text (filler text), to demonstrate the graphic elements of a document and visual presentation, such as font, typography, and layout. The "lorem ipsum" text, which is typically a nonsensical list of semi-Latin words, is a hacked version of a Latin text by Cicero, with words and letters omitted and others inserted. It is NOT proper Latin.
The closest English translation of "lorum ipsum" would be "pain itself" (dolorem = pain, grief, misery, suffering; ipsum = itself). As nonsense (not actual Latin), the text is not italicized. The text often begins as, "Lorem ipsum dolor sit amet, consectetur adipisicing elit ...".
Even though using "lorem ipsum" often arouses curiosity, because of its resemblance to classical Latin, it is not intended to have meaning and is simply used as a place holder. So, just in case you were wondering, that's what it's all about.
|
|
|