Karen Au's COGS 121 Blog: HCI Programming

Wednesday, April 26, 2006

Group Project

Team Members: Divya Kumar, Kelly Miyashiro, Eric Pan, Karen Au, Bryan Tsao, Jun (not finalized, may be too many)

Our group has had an official meeting to discuss our project idea in detail. We have decided to work on a redesign/improvement of the existing bookmarking web program at Del.icio.us.com. Our main goal is to improve the user experience of bookmarking, by developing a more effective and efficient visualization and functionality for the process. Our group has come up with many ideas, also listed on our wiki: http://wombatsarefuzzy.com/wiki, but hope to narrow down the very large scope of our project vision:

Given the growth of the web-surfing culture, the need for online bookmarking has increased. Websites such as del.icio.us and furlit.com cater to this need improving the surfing experience of millions of users. However it is our observation that their user-interface needs tremendous improvement. We have formulated the goals of our project by understanding the basic functionality of online bookmarking sites and the downsides of their user-interface.

Current Situation

Primary functionality of Online bookmarks Managers

  • Allows users to save visited links on the go, by posting the links into their web-accounts
  • Customizable tags to help u associate websites names with generic terms (such as email, movies, blogs etc)
  • Provisions for sorting links based on frequency of a user's visit to the link
  • Provides a count of people who have saved the same website (providing means to collaborate with people of common interests)
  • Allows views of popular and recommendable tags to help discover websites catering to user's interest

Downside

  • Lack of visualizations and other features that would help a user to identify bookmarks faster
  • Tags can be ambiguous, when the user provides different names to bookmarks of the same "taggable" category
  • Limits the number of sites that could be displayed in a page, requiring the user to navigate through several pages to find a bookmark to even the most visited sites
  • Search provision is either unavailable or unsatisfactory
  • Does not display or save images
  • No form of organization to categorize or prioritize bookmarks
Project Vision

The scope of the project is very large, with plenty of features that could be accomodated. However, through the course of this quarter, we aim to narrow down and implement the most significant design changes and functionalities. We have brainstormed many ideas, as mentioned below. In the next couple of weeks, we will improve on or eliminate some.

  1. Our goal is to design the user-experience, targeting non-tech savvy web-surfers for whom convenience of use is a priority
  2. The time spent by a user to identify the desired book-mark should be minimum (even across a potential of over hundreds of links)
  3. Frequently visited sites must appear clearly
  4. Provisions for searcing across the website
  5. Track Freshness: User's favorite websites will be monitored for frequent updates and appropriately pop-up
  6. More visualization
  7. Provisions for saving personalized searches such as driving directions etc.
  8. Provision for saving images and displaying them, possibly as a slide show
  9. Load files, so as to eliminate the need to email files to oneself
  10. Come up with a name of our team and website!
Individual Contribution & Project Interests

I would like to be very involved in the improvement of the information visualization and design aspects, and hope to contribute as a programmer as well. I think that the site currently has a lot of potential, functionality being extremely useful but through a horrible interface. Currently, the visualization is no better than that on a web browser, with the only added benefit of being able to view bookmarks from more than one computer. Some ideas for improvement of visualization:
  1. Organize bookmarks into categorical modules of user preference (e.g. pictures, class websites) or by priority or frequency of visit (e.g. to do's, updated recently)
  2. Ability to drag and drop bookmarks into different sections of page or site
  3. Display when bookmark was last viewed
  4. Incorporate thumbnails or a more visual form of identifying bookmarks, perhaps rollovers, such that user can find site quickly
  5. Display as many bookmarks as possible, so that user does not have to navigate through several pages
  6. When tagging, visualize pre-defined tag names/categories/images

Friday, April 21, 2006

Assignment 1

Ahh, I finally finished part A of website creation:
(I've been having trouble ftp-ing to my server lately, until i realized that it wasn't due to connection difficulties, but that I'd permanently forgotten my password. This link will work, best viewed in Mozilla. In fact, it should only be viewed in Mozilla.)

Live link: http://karenau.net/portfolio

I decided that this would be a good opportunity to work on my personal webpage, something I've been meaning to do for awhile but never had the chance. I'm always working on somebody else's site in my spare time, and when I do get around to it, I can never decide what look I want to go for. This assignment will allow me to experiment with a few different styles and perhaps use all of them. For the next assignments, I am hoping to add more functionality, including javascript to change images within the page (currently I have three separate pages), being able to close the window and return to the "desktop view"/homepage, and system status and time/date on the "system toolbar". I also hope to incorporate a moving scroll for the thumbnail gallery.
On a side note: Originally, I didn't show the window as maximized, and everytime I switched back to viewing the page I would repeatedly trick myself into trying to close the window if it were live. I figured it would not be a very successful website if visitors only tried to close it.

Monday, April 17, 2006

Group Status

I have joined a group with Kelly Miyashiro, Divya, and Eric Pan. We have established a weekly meeting time on Friday morning. So far, it seems like our skills our well rounded. Between the four of us, we each are somewhat experienced in XHTML, CSS, Javascript, and graphic design. However, we have not yet developed any ideas for the project.

Website Redesign

Currently, I am working on redesigning Dr. Kirsh's website at http://davidkirsh.com. The information architecture, graphic design, and layout is quite poor, but hopefully I will be able to organize the information more adequately. The transformation process (but far from final version) can be seen at http://karenau.net/kirshsite.

Google calendar is out!
Overall, it is very useful for collaboration and group meetings. However, I have struggled with a few flaws in the functionality:
  • Unable to incorporate my calendars into gmail
  • Does not conglomerate all calendars into a single calendar when shared with others
  • Unable to delete calendars, sort, or reorganize list
I've been hearing some funny comments lately about being afraid to use google calendar primarily because google has the ability to watch what we are doing at every moment. I guess they have been offered a good sum by the government to spy on its citizens. The more and more google programs we use, the more we are entrusting our lives to them, slowly invading our lives and causing dependency in the same way that the internet has. I'm already addicted, so you can only help yourself.

Wednesday, April 12, 2006

CSS Zen Garden

The power of CSS:

csszengarden.com

The site is an amazing reference tool that shows how css can be used to transform websites without changing the html. The diversity of design is amazing.

Test 1

test 1