Flipping Book – Interactive PDF Viewer

We like to keep an eye out for interesting tools that can be used to enhance a website visitor’s experience.  We came across this neat catalog viewer tool and wanted to share it with you.  It’s called “Flipping Book”.  Click below to check out the demo. 

 page-flip

View Demo: http://page-flip.com/new-demos/03-kitchen-gorenje-2008/index.html

This tool allows you to import a PDF file of a catalog and turn it into an interactive experience for your customers.  Your customers can use their mouse to flip the pages of the catalog and zoom in on certain items.  Here are some other features of this software:

  • Text search
  • Customizable interface (design it to match your site)
  • Viewers can download and/or print the PDF
  • Table of contents interface
  • Ability to create bookmarks
  • Thumbnail view of all of the pages for easier browsing
  • Permanently create a link to a specific page

The next time you need to display a catalog or any other book-type material on a website, think about using the “Flipping Book” to make it an interactive experience for your web visitors.

What do you think of this interactive tool?  Have you used it yet on a website?  Think it might give your customers a way to connect with their website visitors?

How to Create Effective Site Navigation

Effective navigation can make your site easy to use or can cause visitors to leave your site in frustration.  How many times have you been on a site and been annoyed because you couldn’t find what you wanted or the information you were looking for wasn’t where you expected it to be?  Website visitors have been trained to a certain degree to look for information in the most probable places, and when they don’t find what they’re looking for, they get frustrated and leave.  With some planning, you can create your next site so that website visitors can find what they want quickly and easily.

Organize Your Information Well

When designing a website, think about the structure of the site first.  Create an outline of all of the pages and try to organize the information in the most logical way.  What will make the most sense to your website visitors? 

sitemap

 

Get the Most out of Your Primary and Secondary Navigation

The primary navigation will help visitors drill down to the information they are looking for.  From within those main sections, display a list of secondary navigation items to help the user find the page that he is looking for within that section. 

 You can design these links however you want, but the important thing is to be consistent.  Keep your primary navigation in the same place on the page no matter what page the visitor is on.  This continuity on each page will allow the user to easily navigate through the rest of your site.  Here are some other helpful tips:

  • Order your links in terms of the importance of each page.  If your website is selling books, make the links to the different book departments very prominent. 
  •  Remind the user where they are.  When a user clicks on the About Us section, change the color of that navigation item to something different to show the user where they are.   
  • Don’t overload your primary navigation with links to every page in your site.  Simple is better.  If you have too many primary navigation links, think about consolidating some of the pages or moving some information to sub-sections on your site.
  • Keep the names of your site navigation meaningful.  Don’t use terms that are internal to your organization.  Someone who has never been to your site before should know immediately where the link will take them. 

Here are examples of effective primary and secondary navigation:

oc_register

bloomingdales

 apple

 

Create Your Footer Navigation Wisely

There are some links that need to be on every page, but don’t neccessarily need to be featured prominently on the site.  These links can be part of your footer navigation.  Here are some examples of links that can be linked from your footer:

  • Privacy Policy
  • Terms and Conditions
  • Site Map
  • Shipping Information
  • Returns Policy


Use Progression Navigation

If your website contains a shopping cart or a multi-page registration form, it’s a good idea to display progression navigation.  You can do this at the top of the page by displaying where the user is at in the process, such as “Step 2 of 4 – Billing Information”.  This sets the expectation with the visitor how many screens he must go through in order to finish the process.  It also allows the visitor to click to one of the previous steps if they need to make changes. 

amazon

 

Create a Breadcrumb Trail

On sites that are large, it can be useful to implement breadcrumb navigation.  This provides the visitor some visual clues that tell them where they are and how they can navigate back to any previous section.  Breadcrumbs are extremely helpful if the website visitor is linked from an external site.  It gives them a sense of where this page fits in with the rest of the site structure.  Generally these breadcrumbs are displayed toward the top of the page, below the main navigation. 

bn

 

Other Helpful Tips

  • Try to minimize the number of clicks it takes to get to the relevant information as possible.
  • Don’t open pages in new windows, unless they go to an external site.  This confuses users and disables their “Back” button.
  • Make your “Contact Us” link prominent and obvious.
  • Don’t change the position of design elements from page to page.  As a general rule, keep the header and footer of the site consistent on every page. 
  • Use consistent names in your page headers.  If the user clicks on “About Us”, display “About Us” as the header on that page.
  • Always have your logo link to your site’s home page.
  • Use a site map of text links to provide structure of your site to provide direct access to your site’s content.  Make sure that your site map reinforces your site’s hierarchy.
  • Unless your site is small, don’t put every link on every page.  This can be confusing and can overwhelm your visitor.  Create a logical organization of pages using sub-navigation and provide a link to your site map. 
  • Above everything else, make your site’s navigation consistent!  Don’t make your visitors have to re-learn the navigation depending on what page they are on. 

 What tips do you have for creating effective site navigation?  What sites have you found that use effective navigation?  Share in the comments below!

Film Screening: Art & Copy

 

Art & Copy

 

Tonight the Orange County Chapter of AIGA and the Art Institute of Orange County will be offering a free special screening of the documentary film Art & Copy.  This documentary portrays the profound effects that advertising and creativity have on modern culture. The film intimately reveals the relatively unknown personalities and stories of some of the most influential advertising minds of our time.

Location: Art Institute of California, Orange County Campus (3601 W. Sunflower, Costa Mesa, California 92704 )
Date:  Friday, November 6th
Time: 5:00 – 8:00pm
Cost: Free, event is open to the public.  Click here to register. 

Event Schedule
:
5:00pm – Film screens (in outside tent on campus of A.I.)
6:30pm – 30 minute break for refreshments (pizza & beverages provided)
7:00pm – Panel Discussion*
7:30pm – After-Party event at 8 Steers restaurant (3751 S. Harbor Blvd. at Sunflower)

*Panel speakers:
Jimmy Greenway, Film Maker of ‘Art & Copy’
Dan Wayland, Broadcom
Joseph Banuelos, Creative Director Extraordinaire
Jon Gothold, Creative Partner/Prinicpal of DGWB
Ron Leland, RealLife Branding
Kathleen Kaiser, PencilBox Studios

ART & COPY is a powerful new film about advertising and inspiration. Directed by Doug Pray, it reveals the work and wisdom of some of the most influential advertising creatives of our time — people who’ve profoundly impacted our culture, yet are virtually unknown outside their industry.

Exploding forth from advertising’s “creative revolution” of the 1960s, these artists and writers all brought a surprisingly rebellious spirit to their work in a business more often associated with mediocrity or manipulation: George Lois, Mary Wells, Dan Wieden, Lee Clow, Hal Riney and others featured in ART & COPY were responsible for “Just Do It,” “I Love NY,” “Where’s the Beef?,” “Got Milk,” “Think Different,” and brilliant campaigns for everything from cars to presidents.

They managed to grab the attention of millions and truly move them. Visually interwoven with their stories, TV satellites are launched, billboards are erected, and the social and cultural impact of their ads are brought to light in this dynamic exploration of art, commerce, and human emotion.

Read more at http://artandcopyfilm.org/synopsis/

Site Maps: Keep Your Web Projects Profitable

It can be tough managing a website project. You discuss a price for the project and then meet with your client for hours to determine how their website should look like and what should be on it. Then at the end of the design phase, you find out that the project has doubled in size and the client is asking for way more than you originally promised.

How do you keep your project costs in line, but still allow the client to get the website that he wants? And how do you keep your sanity in the process? Here are some guidelines for keeping your project organized:

1. Set up you client’s expectations properly.
Make sure that your client knows exactly what he will be paying for. Don’t just come up with a number that you think is “high enough”. If you quote $8,000 for a website, what does that include? What happens when the client wants to add 10 more pages, how much will you charge? What happens when the client argues that he mentioned those 10 pages in your first meeting and they should have already been included? What happens if the website is so advanced that you can’t program the website for less than $8,000?At Flip Studios, we price out projects in terms of the design, the number of pages in the site as well as each advanced feature that the website will require. This helps the client realize exactly what he’s paying for and which features are more costly. It gives him control to determine if he wants to add more pages or think about consolidating some sections. It sets the expectation that additional pages and features will cost extra.

2. Use a site map to list out all pages in the site.
This will help to determine the actual page count for the entire website. So when you create the site map thinking “About Us” will be a single page, when you sent it to your client for review, he will mention that he thinks it should have 3 sub-pages in that section. Include the site map in your proposal so that the client agrees to the scope of the project.

Your site map doesn’t have to be super complicated to be effective. It needs to keep track of the site structure and organization and the overall page count of the website. The following is an example of what your site map could look like.

sitemap-example-550

3. Talk about what will be on each page of the site.
If the client says he wants to add a property list section, you might be thinking a single page with static text and images, but your client might be thinking of an interactive zip code search, the difference between these features can end up being thousands of dollars and who will be left footing the bill?

Make sure you spell out each feature in your proposal so that it is clear as to what the customer is paying for. If you don’t know what the client wants on each page, include an assumption in the proposal like the following:

“15 website pages as specified on the site map diagram, all pages will include static text and images.”

Then if your client says he meant something different, your proposal will be clear on what was included and you can create a new proposal for the new features.

4. Check on your costs before you provide your client a price.
Don’t give your client a price for something without determining what it will really cost you. Sure that dynamic mouse-over feature will look great and will “wow” all of the website visitors, but don’t throw it in for free and don’t tell the customer it will cost less than it will. Some whiz-bang features look great and seem easy to develop, but they can actually take a lot of time to implement and cost you a lot. Your client won’t mind if you need to look into the cost of adding certain features and your margins on the project will stay profitable.

Take a Sneak Peek at Adobe Photoshop CS5

Check out what’s coming up in the new version of Adobe Photoshop!