ProjectProposal-Scott Friedheim

From CS160 User Interfaces Fa06

Jump to: navigation, search

Contents

Overview

An automated web page layout and creation tool would be a great addition to the Anoto powered software library. As most websites are almost always laid out on paper to begin with, why not translate these layouts directly to the computer. Layout and Design can simply be done with the Anoto pen and special paper and then transferred to a computer where software will read the page layout, special formatting characters (bold, image, table, bullets, ...) and automatically generate the html files.

Target User Group

This tool would be ideal for anyone wanting to create a web page. It could be used by people who have limited to no knowledge of HTML programming because they would only have to draw on the Anoto paper what they want their page to look like and the software will take care of the hard part. This tool could also be used by amateur/professional web designers. As most designers sketch their early web page layouts on paper, this automated tool could be used to save valuable time by letting the software automate the web page creation.

Problem Description

There are a vast amount of web page authoring tools available; some tools are web based while others are software that you install on your computer. But these tools tend to be awkward to use in trying to design a web page layout. Page and object dimensions, placement of text/images/tables/bullets/fields/etc are all difficult to get exactly perfect the first time you try to create a page. It usually requires some fidgeting around to get your page looking right while wasting your time and patience. Another drawback some web authoring tools possess is being intimidating and difficult to use for users new to creating web pages.

This proposed automated tool would solve the above complications simply because of using a paper and pen. There will be no positioning and size complications in designing a web page because whatever was drawn on the paper will be what will be created (WYSIWYG). Also, there will be no learning curve to use this tool providing a viable solution to users with little to no web page experience.

Sample Solution Sketch

Image:Page_automation2.jpg
Above image shows a sketch of a web page drawn using Anoto pen and paper.
There are some basic formatting symbols as well as an image placeholder and filename information.



Of course advanced features can be added to change text/table properties. For example, at the bottom of the above image there is a special symbol to provide a link, in this case, an email address. Also at the bottom are dimension arrows that can be used to specify dimensions of the page/table/etc.
There is probably a limit to the amount of formatting that can be done on the sketch before compromising the design to be transferred to the computer. That being said, page scripting will have to be done after the layout has been created to incorporate Javascript, PHP, etc.

Hiroki Terashima - Sep 11, 2006 12:29:07 am

Nice!



[add comment]