Skip to main content

Home/ TWC301: Multimedia Writing/ Group items tagged flow

Rss Feed Group items tagged

Filter: All | Bookmarks | Topics Simple Middle
Shannon Ridgeway

Does Your Design Flow? | Van SEO Design - 2 views

www.vanseodesign.com/...does-your-design-flow

Flow TWC301

shared by Shannon Ridgeway on 17 Jun 11 - Cached
  • Flow is the way your eye moves or is led through a composition. While most of us will naturally move from one element to another in our own fashion, a designer can control to some extent where the eye moves next.
  • Verbal Flow – the path taken when reading text on the page Visual Flow – the path taken when looking at images and graphics on the page
  • To make copy easier to read you can: Develop a consistent typographic style across your site – Be consistent with your use of font size, face, and color Choose a font for your copy that is easy to read – Your copy is not the place for a fancy font Remember the principle of proximity – Place headings close to the text they refer to, captions close to images. Organize your text elements so it’s clear what goes with what Watch the width of columns – Don’t make columns to wide or too narrow as each hinders reading Develop a vertical rhythm in your type – Use consistent line heights and vertical margins and paddings
  • ...6 more annotations...
  • Again a consistent typographic style and a grid-based layout help maintain the pattern and strengthen the flow of your site.
  • Assuming a left to right reading direction as in English, the natural visual flow for people will be a backwards “S” pattern. You can alter that natural pattern with the images you use, where you place those images, and how images, graphics, and text are mixed on the page.
  • Use the direction of images to control the the speed and direction of flow Create barriers when you want to reverse the eyes direction Create open paths to allow easy movement through your design Use contrasting colors and shapes to pull the eye
  • Many images have a direction. An arrow, a hand pointing, a face looking in one direction. Your eye will speed up or slow down depending on the direction it was moving when it fell on the image.
  • Through good flow you can lead the eye from element to element
  • Kyle Redding on 17 Jun 11
     
    A page on teaching what design flow is and how it works. Teaches you how to keep the reader's eye and make them follow the 'flow'.
  • ...7 more comments...
  • Colleen Urban on 17 Jun 11
     
    This website gives great advice on how to show flow in a website.
  • Karla Freeman on 19 Jun 11
     
    Interesting take on flow in design. Definitely worth reading. I like the information and felt that this could be very helpful in creating pages.
  • Alex Knab on 28 Sep 11
     
    This is a great website that illustrates how important flow is design. It was my favorite of all the pages I visited It gives a great definition of design flow, as well as the 2 kinds of flow (takes examples straight out of Basics of Design). It then goes on and explains how to improve your verbal and visual flow in your work.
  • Jennifer Greenhalgh on 02 Oct 11
     
    This in-depth website shows how to improve your website using the flow to create a more readable page.
  • Heather Krieger on 04 Oct 11
     
    D#7, HW#1-- This is a great website when discussing visual and verbal flow like the book with Chapter 7. Firstly, it explains what visual flow and verbal flow exactly are so that you know where you're starting off, which I really enjoy in a website. Then, the website gives you visual examples of how to improve your current design or document.
  • Briseida Aguirre on 05 Oct 11
     
    This website is good because it gives you a scenario of something you can relate to then it gives you an explanation of both visual and verbal. Then it gives you suggestions on how to improve your work that has to do with visual and verbal flow .
  • Merlyn Reyna on 21 Feb 12
     
    Flow is the way the audience's eyes move through out the design. Its a lead from one element to another. Verbal flow is more like a path that leads you to the next reading text on a separate page. This article is really helpful way to improve "Flow" and provides examples for flow. 
  • Jordin Mitton on 22 Feb 12
     
    This is a good website to help you understand what flow is and the different types of flow. It talks about verbal flow and visual flow. It also goes on to explain how to improve your verbal flow and your visual flow.
  • Bethany Jorgensen on 22 Feb 12
     
    This webpage incorporates more details about many key aspects of flow that were also mentioned in chapter seven. There are tips to improving visual and verbal flow within a page and also how to add flow across an entire site involving many pages.
Shannon Ridgeway

How To Control Flow Within Your Web Designs - 2 views

speckyboy.com/...l-flow-within-your-web-designs

flow TWC301 design

shared by Shannon Ridgeway on 05 Oct 11 - Cached
  • Visual design has a flow as well. You have something to communicate and you want your audience to take in different parts of your page. Some elements of the design are more important and you want to make sure they’re seen right away, and some elements of the design are best seen after having first seen a different part of the design.
  • Design flow (also referred to as movement or direction) is the way the eye moves or is led through a composition
  • Repetition in color, shape, and size create a path that can pull you to move in a certain direction.
  • ...3 more annotations...
  • • Arrows – again it’s difficult not to visually follow the direction an arrow points• People/Faces looking in one direction – similar to arrows when we see a person facing or looking in a given direction, we tend to also look to see what they’re looking at.• Perspective – creates strong visual cues to follow. By it’s nature perspective creates a direction that begs to be followed. If all roads lead to Rome, you’re going to end up in Rome at some point
  • The large black circle in the upper left is the entry point into the painting. It’s the first thing you notice. It’s larger and darker than anything else on the page. It holds more visual weight than any other element in the painting.
  • Space can imply flow in a variety of ways. The space between elements creates paths of emptiness much like footpaths through a forest of garden. An element with visual weight calls for you to rest your eyes on it. Space gives you room to move around elements.
  • ivette munoz on 05 Oct 11
     
    I liked this article the best. It discuses flow within web designs and it covers all the basis for smooth flow for people that are trying to create their own web page. It covers what design flow is and gives an image example of how flow flows within a graphic design. The author states that it is important to create an entry point, "something that stands out from everything else so that most people look at it first". The author also gives advice on controling flow within a design by using arrows, people or faces that look in a certain direction, and perspective. Using space to control flow is something that I found interesting the author states that "varying the space between a series of elements can be used to create rhythm and motion".
  • ...3 more comments...
  • Daniel Flores on 05 Oct 11
     
    a good site that shows how to improve web design with flow
  • Ariella Gabino on 05 Oct 11
     
    This website does a great job explaining the importance of flow in your design. It also gives great examples, mainly of we pages most of which are blogs. I thought this could help us improve our blogs also it is great for those of us who are visual learners to get the importance of flow by all the examples shown.
  • Heather Groen on 18 Feb 12
     
    This site includes several visuals to supplement the presented material on using flow in page design. The primary elements are most important and are intended to be seen first. Other elements are best viewed after the primary element. This hierarchy can be established through flow. An entry point is something that stands out from everything else so that the audience will look at it first. Obvious directional cues include arrows, people/faces looking in one direction, and perspective. Repetition and space can also be used to create flow.
  • gabrielle begay on 22 Feb 12
     
    I found this website to be very helpful when it came to discussing flow and how to achieve that. Besides talking about using visual cues to guide the readers eyes, using space to control flow, and creating harmony using flow, it also gives examples of various websites that have demonstrated good flow of design.
  • gabrielle begay on 22 Feb 12
     
    Control the way your eyes moves through a design by starting off with an object that will catch the viewers attention. How to control the flow oif your design by using visual cues to guide the eyes in that direction. Creating space to control flow and also creating harmony using flow.
Nicole Schmitter

Flow - Composition Flow - Motion in Layout - Motion in Artwork - 0 views

webdesign.about.com/...flow-in-design.htm

TWC301 flow

shared by Nicole Schmitter on 02 Oct 11 - No Cached
  • anonymous on 02 Oct 11
     
    This website is a perfect example of visual flow. It consist of 7 pages displaying the definition and images that explain the concept of visual flow. It stresses basic points such as making sure your text flow from left to right and the viewer's eyes should not slow down.
  • ...3 more comments...
  • Briseida Aguirre on 05 Oct 11
     
    I liked this website it gives a good easy to understand definition of visual flow which is one of the important in overall flow , it gives some examples of images as well , with text and how to use flow for your audience.
  • freda yamoah on 05 Oct 11
     
    - Layout and Artwork that Conveys Motion By Jennifer Kyrnin, About.com GuideFiled In:Web Design / HTML Using flow in a design carries reader`s eye through out the page. Visual flows can be achieved in several ways such as perspective, curves, motion in images , faces etc.
  • robby reiter on 05 Mar 12
     
    On page one, visual flow is defined well. But there are great examples on pages 2-5 on how to use it correctly. Mostly focuses on how the viewers eye catches the prominence of the right elements. Achieving flow through a flawless scheme that leaves no snags or visual loss of the designs message.
  • Nicole Carnal on 06 Mar 12
     
    This site explains how flow can be used, as well as different ways to create flow. It shows common mistakes when using flow and how to correct them.
  • Nicole Schmitter on 28 Apr 12
     
    This is a tutorial that shows examples of good and bad flow. Ways to achieve visual flow is through arrows, sequential images, perspective, gradients, size changes, curves, motion in images, and faces (especially the eyes).
Michael Wheeler

Design Meltdown § Flow - 0 views

www.designmeltdown.com/...Flow

shared by Michael Wheeler on 29 Sep 11 - No Cached
  • Caitlin Burke on 29 Sep 11
     
    Design Meltdown has yet another great explanation of design principles, this time for the principle of flow. The explanation incorporates great visual examples.
  • ...5 more comments...
  • Caitlin Burke on 29 Sep 11
     
    This website usually has my favorite design principle explanations. I just discovered the person who wrote them used the Basics of Design textbooks as their jumping off point for wrting them.
  • Damaris Bravo on 04 Oct 11
     
    This article provides helpful tips on how to create flow. It also provides visual examples of how to create flow in a layout. 
  • Vincent Arcos on 04 Oct 11
     
    This site gives a brief explanation of flow and what it is used for. It also tells which principles are helped out by flow. the site also gives some samples into how some websites use flow.
  • natalie arellano on 21 Feb 12
     
    This site is great at showing flows in designs. It includes descriptions as well as examples.
  • Leslie Lopez on 22 Feb 12
     
    This website does a good job at explaining exactly what flow is. What I like about it is that it provides example of different website and the kind of flow that they have. The arrow that the webpage author draws on the example to show the flow is very useful!
  • Michael Wheeler on 23 Feb 12
     
    This page give multiple page layout examples and then superimposes over them to show the flow of the layout. It also discusses the different flow of each example to help us understand how it works
  • Michael Wheeler on 23 Feb 12
     
    talks about flow as a simple design principle and how it is often a result of contrast and emphasis. page also gives examples of pages and uses a blue arrow to demonstrate the path or flow of the page, just showing different ways pages and be perceived or organized
Paul Angichiodo

Visual Movement - Flow in Web Design | Codrops - 0 views

tympanus.net/...visual-movement-flow

shared by Paul Angichiodo on 07 Jun 11 - No Cached
    • Daniel Throckmorton
      Daniel Throckmorton on 17 Jun 11
       
      This is actually the best analogy for flow that I've seen.
  • The image
  • is leaning toward the right
  • ...11 more annotations...
  • the image of Andrea is facing left guiding the eye to the large, colorful title
    • Daniel Throckmorton
      Daniel Throckmorton on 17 Jun 11
       
      This follows the reverse 'S' pattern that the book was talking about.
  • create a triangle
  • large orange circle grabs your eye as soon as you load the site
  • upper left to the lower right
  • little hidden arrows
  • shape, type and cold contrast to guide you where you need to go
  • blatant pointers
  • guide your users on a path through the site.
  • Lines, shapes, color, depth and hierarchy can all be used to guide the viewer from one point to the next
    • Alex Portela
      Alex Portela on 22 Feb 12
       
      This site has great visual ad examples to show and demonstrate coordination of color and shapes that help the flow of design deliver easy to read messages. Color and lines are exemplary here.
  • N M on 07 Jun 11
     
    The examples in this website provide real-life example, and include a designers explanation below the advertisement/image.
  • ...2 more comments...
  • Bridget Esqueda on 02 Oct 11
     
    I found this web page to be very resourceful. I'm always looking for visual examples and this website had all great examples using real life web pages. It points out exactly what is "flowing" in the design. It gave me great ideas on how to use flow with images and even shapes.
  • Kelly Corbett on 05 Oct 11
     
    This is my favorite of the websites that helped supplement my understanding because it not only explains flow and visual movement but shows examples and each aspect of the example that demonstrates flow. This helps me see exactly how flow can be used, and in all types of different ways.
  • Micheal O'Neil on 06 Feb 12
     
    I bookmarked this website because it really supplemented some of the techniques described in Basics of Design. This website shows great examples of how to manipulate viewers path. The advertisements near the bottom of the page show how to create a visual path for someone with out using a human body.
  • Paul Angichiodo on 01 Apr 12
     
    This article is about visual flow in web design. It acknowledges the differences between flow on the web and flow on fine art. The article provides numerous examples of how visual flow is used on the web.
Yajahira Bojorquez

D#7, HW#1: BASIC DESIGN PRINCIPLES WITH DEBBIE HODGE: FLOW - 1 views

thedailydigi.com/nciples-with-debbie-hodge-flow

shared by Yajahira Bojorquez on 17 Jun 11 - No Cached
  • Rebecca Anderson on 17 Jun 11
     
    BASIC DESIGN PRINCIPLES WITH DEBBIE HODGE: FLOW I like how this website applies the principal of flow to scrapbooking. It has a great visual and very simple explination of flow.
  • Damaris Bravo on 04 Oct 11
     
    I really like this article because it discusses flow from a scrapbooking perspective. I love scrapbooking and found this article to be very helpful in regards to graphic design as well. 
  • Yajahira Bojorquez on 21 Feb 12
     
    It gives good definiton of what visual flow is and it gives directions on how to create a flow on your scrapbook page. It also has other examples of flow and good images. Also explains visual triangle and sequence.
Shannon Ridgeway

Adding Visual Flow to Design | Academy - Detroit - 0 views

www.iadt.edu/...Adding-Visual-Flow-To-Design

flow TWC301

shared by Shannon Ridgeway on 29 Sep 11 - No Cached
  • Caitlin Burke on 29 Sep 11
     
    Explains visual flow and gives a list of some helpful techniques designers use to include flow in their layouts.
  • ...1 more comment...
  • Caitlin Burke on 29 Sep 11
     
    I also really like this site because it has a list of some techniques you can use to enhance the flow of your page.
  • anonymous on 02 Oct 11
     
    This website discusses how to add visual flow your design. It's main topics include visible lines, slight lines, motion, alignment, text, repeating patterns, etc.
  • Micheal O'Neil on 23 Feb 12
     
    This website has many different techniques that must be considered when trying to create good visual flow in multimedia writing. It covers different elements such as lines, motion, alignment, text, repeating patterns, and varying sizes. This website was shared because it gives you many different variables to choose from when creating visual art.
samantha negrin

The New York Times - Breaking News, World News & Multimedia - 0 views

www.nytimes.com

shared by samantha negrin on 04 Oct 11 - Cached
  • samantha negrin on 04 Oct 11
     
    Well this is an example of BAD flow. There are so many things going on here that I can't get organized. All of the titles are bold throughout the page but very spread out, there is a grid but no flow or organization. On the far left there are categories but that is one small example of flow on the website. Otherwise, I think the NY Times website is too scattered and needs a more consistent flow.
Charles Gunder-Heier

The Role of Flow in Web Design - 0 views

msdn.microsoft.com/...ms993280.aspx

Flow TWC301

shared by Charles Gunder-Heier on 03 Oct 11 - No Cached
  • Charles Gunder-Heier on 06 Oct 11
     
    This site is a great example of the design element flow and runs you through different ways of using flow to do different projects. It really gives you a great understanding of what flow really is and how to apply it to whatever your doing. 
Mckell Keeney

D#7 HW#1 Data Flow 2: Visualizing Information in Graphic Design | Brain Pickings - 0 views

www.brainpickings.org/...data-flow-2-book

graphic design flow principles TWC301

shared by Mckell Keeney on 23 Mar 12 - Cached
  • Mckell Keeney on 23 Mar 12
     
    A brief overview of the book, Data Flow 2, Visualizing Information in Graphic Design. Shows some photos and charts that illustrate good flow and uses the words "Eye Candy." Includes links to three other sources, such as Clothing Maps of Europe and London Tube Maps. There is a link to information on their review of the book, The Visual Miscellaneum.
Alex Portela

D#7 HW# 1.1: Design Principles - Design Principles for Websites - Elements of Web Design - 0 views

webdesign.about.com/...Principles_of_Web_Design.htm

design principles flow

shared by Alex Portela on 22 Feb 12 - No Cached
    • Alex Portela
      Alex Portela on 22 Feb 12
       
      Chapter 7 refers to flow as either a visual and/or verbal path movement of how the eyes flow across a design. This site refers to a link for more detail: http://webdesign.about.com/od/webdesignbasics/ss/flow-in-design.htm
Damaris Bravo

D#7 HW#1 Design Flow - Composition Flow - Motion in Layout - Motion in Artwork - 0 views

webdesign.about.com/...flow-in-design_7.htm

shared by Damaris Bravo on 04 Oct 11 - No Cached
  • Damaris Bravo on 04 Oct 11
     
    I really like this article because it gives a clear definition of flow. It also provides some great examples of flow in addition to those already listed in the textbook. 
Shannon Ridgeway

Typographic Contrast and Flow - 0 views

webdesignerwall.com/...typographic-contrast-flow

Flow TWC301 design

shared by Shannon Ridgeway on 07 Jun 11 - No Cached
  • N M on 07 Jun 11
     
    A useful website to summarize contrast to a beginner working in design.
  • Shannon Ridgeway on 22 Apr 12
     
    Typographical flow, broken down into 7 elements.  Size, Typface, Color, Cases, Style and Decoration, Weight, and Space.
Jennifer Greenhalgh

Typefaces | Web Style Guide 3 - 0 views

webstyleguide.com/...4-web-typefaces.html

Chapter7 Flow

shared by Jennifer Greenhalgh on 02 Oct 11 - Cached
  • Jennifer Greenhalgh on 02 Oct 11
     
    This webpage goes into great detail talking about flow, with an emphasis on verbal flow.
Franz Ferguson

DD#7HW#1Print - The 75 Books Every Man Should Read - Esquire - 0 views

www.esquire.com/...75-books

Flow Books. Lists

shared by Franz Ferguson on 04 Oct 11 - No Cached
  • Franz Ferguson on 04 Oct 11
     
    The page is a great illustration of the western flow of reading. There is not much that distracts the reader from the information being given out. The covers of the books guide the viewer to continue downward despite there being any actual guiding line of any sort. Each book is accompanied by a short caption that distinguishes the title of the book from a brief quote or description of the book. All this information is in a easily written font. This whole page is an un-ranked list and it just flows downward allowing the reader to follow the books downward. 
julian serventi

Official Apple Store - Buy iPad, iPhone, Mac Computers and Notebooks, iPod and More - A... - 0 views

store.apple.com/us

shared by julian serventi on 23 Feb 12 - Cached
  • julian serventi on 23 Feb 12
     
    The flow of the page can be seen through the repetition of boxed information throughout the store page. The surrounding edge consisting of mainly text keeps the center of the page, filled with images, at focus with the flow of information/products
Franz Ferguson

Gorgeous Typography Examples in Advertising Design - Noupe - 0 views

www.diigo.com/annotated

shared by Franz Ferguson on 11 Sep 11 - No Cached
  • Franz Ferguson on 11 Sep 11
     
    In this ad, the concept is very simple yet the message behind it is truly deep. This I believe is due to the contrast of the white and red as well as the emphasis of the color white.  The flow of this ad really comes through in the type of font that it was created in. The script makes it flow with the reader as they read the word efficiency
Micheal O'Neil

Introduction to Computer Graphics - 0 views

bccgraphics.blogspot.com/...-to-enhance-verbal-and_20.html

shared by Micheal O'Neil on 06 Feb 12 - No Cached
  • Micheal O'Neil on 06 Feb 12
     
    This website was sweet and simple. It is a graphic designer blog and lists 12 techniques for implementing flow into websites. I have listed a few tips that stood out to myself. -Place headlines near articles -Choose an easy-to-read serif typeface such as Times Roman or Garamo -Use columns that are neither too wide nor too narrow -Place quotes on the page with the text it reinforces
Micheal O'Neil

Flow Chart Template - 0 views

office.microsoft.com/...simple-layout-TC001018440.aspx

shared by Micheal O'Neil on 23 Feb 12 - No Cached
  • Micheal O'Neil on 23 Feb 12
     
    I decided to research a flow chart template. I wanted to have one on hand because it will be useful in the future. Microsoft templates are always a good bookmark to search.
Micheal O'Neil

Create Flow using the liquify tool - 0 views

www.sigtutorials.com/...liquify-tool.html

shared by Micheal O'Neil on 23 Feb 12 - No Cached
  • Micheal O'Neil on 23 Feb 12
     
    This website explains how to utilize photoshop to the fullest. It covers the liquify tool and how it adjusts the flow in your images. It describes the process by creating a signature.
1 - 20 of 50 Next › Last »
Showing 20▼ items per page