Designing for Web Communication. Charles Robbins

Transcription

1 Designing for Web Communication Charles Robbins

2 Designing for Web Communication Design as a Communication Tool Determining the Content of a Website Determining Shape and Color of a Website Determining a Focal Point or Theme Designing a Living Product

3 Design as a Communication Tool Primarily for the viewer Keep to the topic or theme Watch the interaction Conduct surveys

4 Determining the Content of a Website Determine the links for the viewer

5 Awards On this page, we will link awards the organization has earned have a small description of each award show an image of the certificate or trophy display an image of the recipient

6 Gallery There should be a paragraph highlighting the achievements in each area. The main image on the gallery page should be the most important image. For example, if the organization is known throughout the region for their Digital Art, this will be the emphasis image. The other two images should take secondary positions on the web page. If the web designer chooses to use a Flash graphic, the presentation should still follow suit, with presenting the main subject and then minor topics, second.

7 Art Lessons On this page, we will link lessons that demonstrate the organization s ability to take a leading role in their field. Customers do not appreciate being told how to create anything, so a small lesson explaining an artistic concept can really appreciated by existing and future clients. For our website, we will have links to web pages for lessons on Animation Shop, Paint Shop Pro and Flash. We will also have a web page with links to free and trial software available. Another web page we may consider is one with frequently asked questions, where the link would be titled FAQ.

8 Virtual Tour We were initially are amazed about the popularity of the virtual tour, but in retrospect, this should be a somewhat obvious web page, considering our culture today. After a few years, many times we felt that the video clip should be made prior to printed material, since the audience rather watch the explanation than to read the PDF file. We need a Meet the Artist link and one, which takes the client from beginning to end the artistic process.

9 Products The Products web page will contain five links, Web, Trifold, Poster, Sign, T-Shirt and Hats Packages. This is strictly the business section of the website where the different types of finished goods are described. Companies need to provide a starting point for talking an order. Housing developers and even Dell, the computer company provides an opening point to begin the selling of their merchandise. As on other secondary web pages, there can be multiple web pages linked. For example on the Web Packages page, there can be links for Family, Memorial, Scrapbook, Small Business, Medium Business and Custom. The Web Packages web page can grow with the art business.

10 Art First We created a link to a web page called Art First. The web page contains a link to Lincoln School and Local Festivals. They are great advertisement for the business. Remember, the students and people we serve today, will be your paying customers in years to come. Having a long term outlook in presenting an organization goes a long way to integrating the new business into an existing neighborhood.

11 Contact Us This page will have a link to a web page that provides direction to the business. If the company is strictly a web business without a physical storefront, remove the directions link. The Contact Us web page should contain a form We should look for this feature when we select a provider.

12 Careers The Careers link will steer those interested in the field of art and design towards the businesses hiring artist and designers. Many times this question comes up more than the weather or food. The links to others employment web pages should open a new browser page on the desktop, not leaving our website.

13 Membership The Membership web page will contain the names of any professional or business associations, which the business belongs. We can add links to the professional organizations. The links to others association s web pages should open a new browser page on the desktop, not leaving our website.

14 Press Release We place articles and images that are ready for publishing on the Press Release web page using a link for each PDF word processing file and image. These commentaries are already approved for release to any news group. We can also position links for advertising posters for the company or community events on the web page. Some organizations also place their monthly newsletter on the page

15 About Us The About Us web page contains short biographies of key personnel in the organization. These short paragraphs tell the viewer about our staff s experiences Some associations also post their mission statements on this page.

16 Policies Privacy policies web pages contain legal agreements concerning the handling of data that is sent to the webmaster. The policies discuss sharing or selling the information to other parties About turning over the information to the government should a warrant be served to obtain the data. The policy page can also address underage usage on the website. The business owner or webmaster should seek legal council to review this page and the rest of the site

17 Site Map The site map is a diagram containing all of the links on the website. For some individuals, they prefer to have all the links on one page to surf to the desired web page versus using an internal search engine.

18 Determining Shape and Color of Shape is first a Website Color is second Both will determine how the viewer react to our site

19 Web Research 1 - Pixar Foreground colors are more dominant themes of red, blue and yellow Background colors have equal amounts of red, green and blue Shapes are natural, use of splines and geometric shapes. Most straight lines in the background Family audience

20 Web Research 2 Louvre Foreground colors are more dominant themes of green, blue and yellow Background colors have equal amounts of red, green and blue Shapes are geometric in the background, with natural shapes in the foreground Sophisticated audience

21 Web Research 3 Big Idea Foreground colors are more dominant themes of green, red, blue and yellow Background colors have equal amounts of red, green and blue Shapes are geometric in the background, with small curved shapes in the foreground Religious, family

22 Web Research 3 Stinson Brand Innovation Foreground colors are more dominant themes of green and red. Background colors is white. Shapes are geometric in the background, with geometric shapes in the foreground Business

23 Web Research 5 Columbus Sign Company Foreground colors are more dominant themes of red. Background colors is black and white. Shapes are geometric in the background, with geometric shapes in the foreground Business

24 Determining a Focal Point or One image tells all Can say it to 85% of the viewers without words Theme

25 Create a Storyboard Layout the page Name images Assign sizes

26 Color Storyboard

27 Designing a Living Product Save all your ideas Look forward Be patient