Garo Garabedyan- a private blog

( Case Study on YouTube’s Interface )

One of the things I like in Graphical Operating Systems is that they try to understand what are the user needs. If we look at this video list (on the left), I really can’t understand what are they about. Making Web 2.0 looking more powerful and a first competitor of the Operating Systems, it (Web 2.0) needs to present to the user with as much information as needed in an easy way. Imagine you mouse over the video link and see its all name, not the short version anymore. Isn’t it a great web interface-user interaction.

|

|

|

You can see on the left a custom designed scroll bar for viewing video lists. (which control can be used for presenting even every big list)

While you explore a list of videos the page presents you the ability to click on “See all ** videos” link which opens you a new page containing the all videos from the viewed category, author or whatever.

The idea of this User Interface Control is to let user get as much items as he wants from the huge amount of items that exists on the server (or wherever). Of course at some moment you will get interested in the videos and viewing them this way in a small list will not satisfy you, so it is good to have down to the list a link which will drive you to a page which contains in general the video list (like now YouTube does) of course not from the begging but on place where you stopped using the list box.

The control doesn’t present the user with the ability to undo some adding or remove the last items from the loaded list.

While watching a very long video (i.e. 52 min long) you will realize that the scroll bar of the video will get practically unusable. This custom scroll bar enables setting a step which helps you navigate around.

These two scroll bars are able to be combined in one universal scroll bar.

The controls are able to be implemented by JavaScript and Ajax.

It would be cool to comment a concrete scene from movie, not the all one. In such a way to search around long time movies.

I believe that the trend of Web 2.0 have to be making users keep everything about one topic in one page. There is no need of many tabs to do just one thing. People want to place everything about some their work on one page. In web developers’ prospective this will help them to understand a lot of things about the user and how he is using theirs page and about what. Just help him and/ or give him an ad.

Editing wiki content with Ajax is more easy and fast. Special JS code can make a big step in recognizing Document Revisions of a wiki article.

Have you got enough time to press “[Edit]” and go to the editing page of the wiki site and find (recognize) what you have just wanted to edit. Here I draw the steps that you take when you want to edit a wiki-like page:

• find something or some things that you want to edit. (information that you want to precise, fix it)
• find and press the edit button for the page (in general the edit button for the area of text which you want to edit)
• new page with editing area is loaded in the browser on the place (in general when you don’t open it in a new tab) of the already red text (at which you remember the formatting and placing of the text and the places you want to edit)
• try to find place(s) of text which you want to change. Notice that now the content seems extremely different- the previous formatting of the content is lost- it has been converted into a plain text; to the previous content are added many special symbols (its important to notice that an array of symbols is forming a special symbol, so special symbols are a heavy weight visualization content) and the size of the content is increased extremely.
• editing (its important in some way to be familiar with some special symbols)

I believe that there is a better, easier way and more user-friendly to provide editing of a wiki page. Using Ajax you can let the user to edit concrete part of text and do it dynamicly without reloading the page, even you can keep the formating of the text and to not convert it (the formating) into special symbols.

What is the scenario (use-case) in the users view in this better way:

• find something you want to edit
• mark it (no matter is it a paragraph, sentence or few words)
• press special combination of button(s) or press a special button
• the selected content is turned into a textarea and according to the type of the selected content to the user are present special editing tools for the concrete aim
• edit
• press “Save” (or maybe “Update” is a better name of this button) or “Cancel” in order to save the changes or to ignore them
• getting the previous view of the page (not needed reloading it, just refreshing the edited text, for efficiency you can skip the last step is the content wasn’t changed- if it was pressed skip button, you can skip to check for changes if the user has pressed “save” and ask the server for the content).

In point 4 of the last scenario I was talking about this: Many wiki pages content special areas for adding notations, editing/ automatic creating of contents of a page, picture, table, part of an other wiki page, notes, references.

When this areas of content (or areas containing this kind of content) are edited its useful to present to the user specific tools for the concrete area (to make this tools visible). Else you can just let the user with a minimum amount of editing tools and provide way of choosing viewing some extra tools.

The text area is supposed to not present in general the content by special symbols, but like the content should look like. The user can be provided with an additional button (or tab) in order to get a plain text and special symbols of the content- the source code of the concrete text.

Many times people browse wiki pages while they are finding information. When they see some small mistake or not complete truth, they really don’t have the time to go to the edit page and fix the problem. I think that it is supposed to be more easy for them to use this kind of editing and this way to keep wiki content in a high quality.

May be it is hard to keep the same pixel place of the text which has to be edited you can enable something like this:

• user marks text which he wants to edit
• user presses Ajax powered button (or in TiddlyWiki double-clicks on the tiddler (text post))
• text turns into a textarea but the marked characters are again marked (in order the user to find what he was just reading) (with or without the special formating symbols)
  • There are web based word processors using html (of course not the all amount of tags, but limited one) as content of documents. In example Google Docs, WordPress.Com

Document revisions
There is a big field in Information Technologies which tries to point the differences between many revisions of one text. With an intelligent Ajax application, a wiki editing can be separated into 3 /three/ operations: Add, Erase and Change content. This way it will be clear what is the user doing and on which particular piece from the document. Google Docs do the same thing- tracing the user actions and concluding in Documents, Spreadsheets and Presentations and what are their intentions, but Wiki Ajax app can be better.

2 /two/ actions: Add content, Erase content can be recognized by a JS function which is called every time a change is made in the document. This way we can work not with paragraphs, sentences and words… just working with every symbol and knowing that it is possible after it (next change in time period) to be added another next to the previous added on (in the content). Or to recognize when a piece of text is erased and another symbol is added on its place or that there is no symbol added on the erased text.

Visit this links in order to find interesting stuff about Gmail contact list unauthorized viewing through JSON and JavaScript. It is important to take a mark of this vulnerability in order to not make the same mistake.

Private Blog of Jeremiah Grossman
Ajaxian Archived post

According to me the best technique protecting JSON data is to add at the beginning of the file (or JSON data response): “while(1);” as Gmail now does. Actually this tries to prevent anyone of understanding is the data is sent and of course prevents people of accessing the content. In order to provide security you have to not enable hackers to see your data and even are you responding on something.