Screenshots!

Hey,

I realize I have disappeared from the blog for a long time, but I swear I have been hard at work on the web app itself. After getting the basic functionality done (adding links, searching, etc.), I have spent way too much time on the look and feel of the interface.

On the one hand, I've learned a lot about ajax and dynamic web design. On the other I might suffer a stroke if I find one more bug in Firefox or IE.

At this point I will switch over to working on the rating system. For R2 to work, users have to be able to weed out bad links, and approve of useful ones. We also need to add a way for users to flag spam.

-Ben

Firefox Extension Progress

So I've begun the Firefox extension. Writing an extension in XUL and JS for Firefox is likely one of the least pleasant programming experiences I've had. My main problem with it is the lack of decent tools for debugging. As far as I can tell, unless you have a glaring syntax error somewhere in your code, you never hear about any problems from the browser. Rather, your JS thread just exceptions out silently and stops execution.

Despite these difficulties, I think we've beaten down the hard part of the plugin. You can now pull up a sidebar with a keyboard shortcut and it will notice what track what page your eyeballs are on. All that remains now is to yank data with the API and show it in a snazzy way. As proof that the extension is somewhat functional, enjoy this screenshot.

If anyone has any experience in building extensions like this please drop me a line and give me some hints :) I'm spending more time looking at example code than I am writing my own, but more information will help. Also, Ben should post sometime soon with a screenshot of how he's prettied up the web interface.

And back to our regular schedule

Sorry for that long interlude. I'll chalk most of it up to The Coachella Valley Music Festival which took up five days of our lives, and I've definitely spent the week recovering as well. In case you were wondering the show rocked. I'm not sure if I'll ever get over how amazing Ratatat was.

Anyway, back to R2. Things are actually on schedule! There is an interface, though it isn't exactly pretty. I just spent an hour and a half refactoring our django code so it is quite pretty and will be nicer to work with. I learned from this post that you can separate your views into separate files for ease. I did the same with our URLs and I'm contemplating doing the same to our models. We now keep primary, API, and Ajax code in totally separate files.

Speaking of Ajax, I also rewrote all of the JavaScript in the site using the Prototype library. That library is awesome. JavaScript is downright incomplete without it. I'm pretty new to real JS coding so if you have any tips for me leave a comment. I can generally get by with it but I have no eye for front-end work in general.

We've also had two meetings with our TA, both of which went very well. We were way ahead of schedule for the first week so things worked out in our second meeting even though we spent 5 of the 7 interleaving days in SoCal. The group that meets before us is developing an XBox 360 game, so when we get there they are demo'ing on an XBox while I just have my MacBook. It's a little intimidating.

We have big plans for this week, and I'll probably spend the rest of the night and some of Sunday on the project. Here's what we hope to have done this week:

• API 100% ready to ship.
• Some fancy Ajax to enhance the UI (we have type-inference, we need auto-title-getting and some others)
• Implement the user system
• Get the browser plugin to hello world state

It should be pretty doable, but I think I have a few midterms this week so we'll see.

Oh, and of course, enjoy some screenshots of the testing UI at 1140 lines of python, 279 lines of template/html, and a few dozen lines of CSS and JS.

Development Roadmap

Part of the project proposal was to write a roadmap for development, and here it is.

April 20, 2007 - database backend, simple ui
April 27, 2007 - define api, improve adding ui
May 4, 2007 - implement api, web adding ui done
May 11, 2007 - begin browsing ui, plugin
May 18, 2007 - finish simple browsing, add through plugin
May 27, 2007 - begin graphical browsing, have plugin lookup data
June 3, 2007 - finish browsing, polish site, start ui for plugin
June 10, 2007 - polish plugin, publish site, add seed relations, data

I feel I could get this done a lot faster if I weren't taking 5 other classes, but oh well. It seems pretty reasonable.

Still alive

Hey folks, just wanted to let you know that we're still alive and working on R2. Other school-related things kept me busy this weekend. Tomorrow I give a presentation on R2 to the rest of the Software Project class. I'll let you know how it goes.

If anyone is perchance going to be at the Netvibes party in SF tonight shoot me an email. I'll be there.

Announcing Relates2

The project shall be called Relates2! We call it R2 for short.

I turned in the first draft of my project proposal yesterday. I'll post a PDF of the final here after I meet with a tutor and revise it and whatnot. The whole thing is 13 pages long and definitely not worth reading because proposals are by nature repetitive, but here's the introduction and the feature set. I'll get into the gritty technical details this weekend when I actually start coding (finally).

--
Summary
Relates2 is a web-based application where users can declare a relationship between any two web addresses (URIs). URIs can be associated by any relationship in R2's database, which can be amended and added to by users under guidance by administrators. Once the relationship between two sites is known, linked content can either be embedded throughout the web through our API or can be viewed using our Firefox plugin. In the end users enjoy a richer browsing experience that is augmented by relevant largely user-generated content.

Feature Specification
R2 is made up of several interlocking but conceptually distinct components: the backend, the web interface, the API interface, and the browser plugin.

Database/Backend
This part of the product is invisible to the user and thus we are free to implement it any way we see fit. All it really has to do is be reliable and store the data required to run the rest of the site: every relation we recognize, every type of resource we recognize, every pair of related URIs, users, rules, and various statistics.

Web Interface
This is the first user-facing part of the product. Through it, users can:

Link two sites. Upon entering the URIs of the two sites, R2 tries to infer the types of the URIs and suggests them to the user. The interface also suggests a relationship between the two resources if it knows their types. The user is free to override either. Once entered, the link is stored in the database and available for querying.

View related content. The user can enter a URI and then view a list of all content related to that URI. The related content interface will at the very least allow the user to sort by type of relation and popularity of the link. When content links correspond to media the media will be previewed inline. The web interface will also allow a user to agree or disagree with a link. This interface is the part of the project most open to interpretation. Though it is not of the highest priority we believe that there is a lot of innovation that could go into this part of the site, including graphical and interactive methods of viewing relationships.

View new content. The user can view a list of all the recently linked resources. Sorting can be done at least by popularity and relationship.

API
The API allows developers to do anything that can be done through the web interface, only through XML and without any presentation necessary. There will also be API calls to return pre-formatted information for easy embedding on the web. The API will feature useful presentation-minded features that prepare content for embedding, i.e. a method such as getThumbnail that knows how to extract a thumbnail from common sources such as Flickr and YouTube. To use the API developers will need to have an API key in much the same way that the Flickr and Facebook APIs require.

Browser Plugin
The last component of R2 will be a browser plugin targetted at Firefox users. It will normally run as an icon in the corner of the browser window, out of the user's view until the user wishes to use it. When the user views a site that has related content known to R2, the icon changes colors to signify that it has information for the user. If interested, the user can click the icon and a sidebar will appear. Related content will be listed as it is in the web interface, with media shown inline where possible and various sorting options available. The user can quickly add other content through the plugin as well.

TechCrunch covers web annotations

Too bad TechCrunch didn't decide to write this article about web annotations a month and a half later. Otherwise, I would hope that we were on it because I think Artoo is in the same product space but does web annotations much better.

Annotating the web is definitely not a new idea, as the article points out. However, I think we have a better idea of what kinds of annotations users actually want to utilize now than we did before. We also know that users have something valuable to contribute to a website. I think that the solutions covered by TechCrunch don't quite have the right understanding still.

If you squint your eyes del.icio.us is nothing more than a web annotation tool. It lets users decorate a site with a few tags to describe it, although no one cares what these tags are once they get to a website. It's a tiny way to remix the web.

These tools go far beyond the functionality of del.icio.us, of course. The annotation is supposed to enhance the browsing experience once a user has reached a page. This is exactly the goal of Artoo.

I really think that the latest generation of annotation tools misses the point of what users want yet again. 'Web graffiti' is too harsh of a term to describe them, but not much too harsh. They focus on text and actual markups on the physical page. They expect that whoever has something worth saying about the page also runs across the page and has the plugin installed. They also expect that users viewing annotations on a page trust the block of text or inline image left by some other user. This is the crux of their shortcomings: they believe that annotations can stand on their own.

I fundamentally disagree that an annotation can stand on its own. Artoo abstracts the notion of an annotation by adding a level of indirection. Rather than letting a user's contribution atop a site stand alone, Artoo gives the annotation context and legitimacy. A web resource (anyone have a better name for this? I mean a video, a picture, a web page, just any piece of content.) can stand on its own, for it is used to doing that. Yelp.com reviews exist perfectly well far away from the things they review because Yelp is an entity on its own with its own sense of legitimacy. A random inline annotation on a webpage has no such luck; it is untrustworthy by default because this is the wild, wild web.

The simple addition of indirection makes Artoo innovative far beyond what anyone will call web graffiti. I wish TrailFire, Stickis, ShiftSpace, Fleck, and Diigo all the best, but their products are inherently limited when compared to Artoo.