Beyond Citation: Wireframes A Visual Tool

Web designers should aim to create a satisfactory and enjoyable user experience.  As I think about scholars and librarians, the individuals who are most likely to visit the Beyond Citation website, I wonder how its design will aid in the discovery of new information. Because wireframes assist the placement of rectangles on grids and the appropriate use of negative space (any space which is not in use by an item) as an integral part of the design, I imagine if implemented well, the user will be visually attracted to the website. As the website’s designer, I believe the best way to alleviate concerns around layout is to use wireframes, which are meant to support the purpose and main idea of the imagined website. Although the wireframe appears simplistic because it is often completed in black or white, once executed through scripts in HTML5 and CSS, the wireframe becomes the underlying structure that will ultimately point users to the discovery of information.

The placement of content and the function of fields should each complement the user’s experience, and promote ease of use.  Wireframes are building blocks that can aid in developing the personality of the website by emphasizing type size while minimizing the use of words and utilizing rectangles to describe content placement. The wireframe’s adaptive nature aids in responsive design, and may consider varied grid widths to accommodate computer screens, tablets and mobile phones. The website’s navigational roadmap is conceived through the developed wireframe, and is assisted by design that makes its primary statement within the confines of the wireframe.  Wireframes visually describe the construction of web pages.

Wireframes can be created on tablets and apps which aid the ability to revise and share development as a collaborative tool. Wireframes also alleviate worry as they create a complementary relationship between the idea, the design and pixels, and when completed, usher in the next stage of the website’s development, which is scripting.  Wireframes are the blueprint that will be utilized to create the Beyond Citation website.

One thought on “Beyond Citation: Wireframes A Visual Tool

  1. Profile photo of Matthew K. GoldMatthew K. Gold

    Very glad to see your group creating wireframes for your project; as you point out, wireframes are an important part of the web design process, as they help make clear issues of layout.

    One note: HTML and CSS aren’t really programming languages like PHP, Ruby, or C++–they don’t execute scripts, and instead are used for mark-up.

Comments are closed.