...
Bob is a blogger. He and his friends go to the zoo to see some animals, and he decides it will be a great opportunity to add to his relatively new blog after he gets home. First they go to see the baboons, and then explore the rest of the zoo. After a great day at the zoo, he goes home to upload some of the videos and pictures he’s taken along with stories about the animals they saw. He logs into his blog, and starts to create a new post. As he’s creating his post, he works to format his text and media layout, embed his images in a way he finds pleasing, and write text conveying what he did that day to his readers.
Storyboard
Design 1
http://i.imgur.com/G7FLa.jpg
http://i.imgur.com/h0mYZ.jpg
Description
A new document will resemble a blank slide in Powerpoint’s editing interface: on the white document area, there will be an empty box prompting the user to input content. Users can add, delete, move, and resize these boxes as they wish, but all content will be visually contained within these boxes. Users can put different types of elements inside each box: images, photos, Youtube videos, equations, etc. Therefore, if users want to place an element in a position relative to the text, then they would put them in the same box as the text; otherwise, if users want to place an element in a specific position on the page, they would put them in a separate box.
...
- Since this interface gives the user a lot of freedom with positioning and layout, the user might create something that is not pleasing to them, or arrange things in a way that makes sense - the layout will only be as good as the user can make it
Design 2
Description
This design is like a composition of several Tumblr posts. On Tumblr, one can post a text post, video, or image, but only separately. In our design, a document is composed of multiple sections, and each section contains one type of media. There are no options for layout other than rearranging the order of the sections. The main advantages are that this design is the simplest to work with and to create, and that it would be easy for developers to create new kinds of sections and integrate them into the editor (it would be kind of like a template). The disadvantage is that there aren’t many options for users who want complete control over what their documents look like.
...
- Less familiar interface might cause people to make errors at first and not know how to correct them
Design 3
*http://i.imgur.com/9plLlbf5Gs.jpg*
*http://i.imgur.com/bf5Gs9plLl.jpg*
*http://i.imgur.com/LTbyc.jpg*
*http://i.imgur.com/d8PPU.jpg*
Description
Basically this design would be similar to a GUI for viewing HTML/CSS code, but allows the styling to be more intuitive for the user. There will be two panes - an editing pane and a view pane, which appear side by side. You work by adding content to content boxes or sections in the editing pane, and the view pane will display what your finished document would look like if you stopped working right then and there. There are content boxes for each section of the document or blog that the user wants to produce, with two dynamic drop down menus denoting what type of content the user wants to produce, and where to put that content. There are two main types of sections: main content sections, and subsections. Main content sections are added by clicking a “new field” button underneath the bottommost section. Subsections are things like lists or quotes, and can be added to main paragraph sections (by pressing a big + button next to the paragraph content, as opposed to clicking the “new field” button for adding normal sections).
...