Archive for the ‘Personal Projects’ Category

Firedoodle Web Highlighter Beta Release

March 12, 2007

Firedoodle Example

I’m proud to announce my latest project is now available as a beta release. Firedoodle is a Firefox Add-On that allows you to mark up any page as if it was projected onto a white board. You can download the plugin at Firedoodle.com and if you register an account, any highlights you created can be saved (and later shared).

I hope you like what I’ve created. Since this is a beta release, there may be bugs. If you run across any problems, please post a response here about them.

Thanks!

LinkPut – Wiki’d Search Results

November 4, 2006

A little over a year ago I was really getting frustrated with search results. I consider myself a pretty good searcher, it’s not often that I have to go beyond a page or two to find what I’m looking for, but the “blurbs” that describe the link are sometimes so cryptic they border on pointless. Also at the time, I was really fascinated with wikis and loved the way their community comes together to develop something very understanding about any topic. One afternoon, will searching around on Google, I had the idea of combining a search engine with a wiki… what would happen if the result blurbs could be publicly modified to better reflect the content of the site? With that in mind, I began experimenting with a project I called LinkPut – Input for Links.

Project Technicals

  • This project was originally written in ASP/SQL Server, and then rewritten in PHP/MySQL. Because it was my first PHP project, once I began learning more and more, I decided to rewrite it once again, taking into account all the new stuff I learned from my first round.
  • The search results use the Yahoo API. Yahoo allowed for more requests per day than Google; at least at the time, I don’t know if that is still true.
  • Originally it was called WikiSearch, but that sounded too much like a search engine that crawled wikis, which is misleading. The database is still named after this original title.

LinkPut Homepage

1-homepage.jpg

This is the LinkPut homepage. Not a typical search engine homepage interface, but I wanted to display recent activity of the site. With that in mind, I display:

bullet_1 The last URL that has been wiki’d
bullet_1 The last comment made to a URL
bullet_1 Various site stats such as number of sites wiki’d, request made to Yahoo, click throughs, tags, etc.
 

LinkPut Search Results

2-searched.jpg

After you perform a search, the Yahoo results come through. They are parsed and displayed. However, if we find that our database has an edited blurb, it is displayed instead of the normal one returned from Yahoo, as indicated by displaying the LinkPut logo versus the Yahoo logo.

bullet_1 Logo displaying where blurb is coming from
bullet_1 The wiki’d blurb
bullet_1 Other information about the site that has been collected, such as your last visit, tags, who edited the blurb last… this information is customizable so that you can show whatever you wish, including both Yahoo and LinkPut’s blurbs.
bullet_1 User controls for this URL:

  • Link to comments about this URL
  • Link to the wiki editor for this URL
  • Link to bookmark this site with Delicious
  • Link to an RSS feed so that you can monitor edits to this URL
bullet_1 Other results
 

Visited Site Questionnaire

3-site_review.jpg

If you visit a site via LinkPut, on your next visit, you are asked to rate various aspects of the site. This data is collected to help better define sites. Of course, answering these questions is completely optional.

bullet_1 The site questionnaire. Questions include:

  • Did this page contain the information you were looking for?
  • Would you recommend this site to other users?
  • Did the description accurately reflect the contents of the page?
  • How were the ads/pop-ups on this page?
  • What type of site was this? (Arts/Humanities, Business, Computers, Health, etc.
  • Add your own tags.
 

More Information

4-more-info.jpg

Clicking on more information about a site brings you to this page. Here, you can read a more detailed description of the site, tag it, or leave a comment.

bullet_1 Site title and URL
bullet_1 LinkPut also performs a URL shortening service to give you shorter links for long, complex URLs.
bullet_1 Wiki’d entry for URL
bullet_1 Common tags and input area for you to tag the URL
bullet_1 Link to wiki editor or submit URL to Delicious
bullet_1 Commenting area
 

Wiki Editor

5-edit-info.jpg

This is the Wiki Editor page. Here the user finds a very simplified wiki type editor for making changes to the entry.

bullet_1 Description/Blurb area
bullet_1 Pointer Area: If this page shares many characteristics of another page, a pointer could be set up so that this page uses the Wiki entry of another. The pointer must point to a URL from the same domain.
bullet_1 Notes about the last edit
bullet_1 Notes about the edit you are currently doing
bullet_1 Change History with links to roll back to previous versions
 

Search History

6-search-history.jpg

This is the history of sites you’ve visited via LinkPut.

bullet_1 Delete option
bullet_1 Date visited
bullet_1 Site information
bullet_1 Query you used at the time
bullet_1 Links to:

  • Add to Delicious
  • Monitor via RSS
  • Edit wiki entry
 

Tag Search

7-tag-search.jpg

You can search LinkPuts tagged sites from this page. Since this site is a search engine, I wanted to do a little something different with the tag search rather than duplicating the normal search functionality of the site.

bullet_1 Tags you are currently filtering with. Tags are weighed from left to right, so controls under each tag allow you to rearrange (or remove) them.
bullet_1 Add a new tag to the filter and specify if you want to look at just your tagged sites, or the communities tagged sites.
bullet_1 The results of the search that displays all LinkPut gathered information for a URL.
 

Tag Marks – Collapsed

8-tag-marks.jpg

TagMarks, a name I came up with because this page sorts your tagged URLs much like you would manage your bookmarks in your browser. You create a hierarchy of tags like you would a folder structure. Say for instance you create a tag folder called Politics and one called Tech. Any URL you tagged with Politics will appear in that folder, and all URLs tagged Tech appear when you expand that folder. Inside the Tech folder, you can create sub folders, say Web and OS, so anything you tagged Tech, Web appears in the appropriate folder. I found it to be a great way to browse through your tagged items.

bullet_1 Root level tag folders
bullet_1 Input to add another tag folder
bullet_1 Controls for this folder:

  • Number of sites in this folder
  • RSS feed of links in this folder
  • Edit tag(s) used for this folder
  • Ability to delete a folder
 

Tag Marks – Exapnded

9-tag-marks-expanded.jpg

This is the tagged folder expanded to show its contents. Users could have up to 5 levels of folders to really focus their tagged content.

Finally

I’ve had some ideas lately on how to improve LinkPut and wanted to have this post available to reference you to when I start going into some of them. In any case, I hope you found some of these ideas interesting.

dID: Fill out any form, any where, with one click

October 26, 2006

There are countless rants about every web site out there requiring you to create an account. Who isn’t turned off with creating logins, logging in, requesting lost passwords and the like? Yeah, I know… most places I could click the “remember me” button, but I’m a developer, I’m constantly clearing my cache and cookies. Hey, I’m easily forgettable… and I think only once in my professional career have I ever written down a password. It’s a big mess.

Ok, so what about other things that I’m constantly doing out over and over and over again like my address? What if I had a system that had all the data I wanted to put in there, then when I went to any form, on any site, I just clicked a button and my info is there, submitted, and I’m moving on. Yeah, that’s exactly what I wanted… so I thought about it for a few days and then developed for about 2 weeks, calling the project danielID, or dID for short.

dID consisted of three major parts:

  • There was the dID web site, where you would ::gulp:: log in and create your profile. It was broken down into various areas such as personal, business, etc. Also, here you could find logs where you’ve sent your data, who is requesting your data, etc.
  • The dID Firefox extension. My first attempt at writing an extension, and while I didn’t get far (just enough to get it to work) it was very interesting stuff. Basically, the extension runs in your tool bar and anytime you are on a page with a form, clicking it would analyze the form and fit as much as your info into it that it could.
  • The third piece was just a pretty interface, launched by a bookmarklet, which would give you greater control over the forms on a page. It was geared towards volunteers wanting to help the project by aligning data at dID to data at a site. For instance, dID may have you first name mapped to fname and firstname, the site you are on has a form with a first name field, but its named first_name. With this control panel, a volunteer could map that field name to our field for first names.

So, that last bullet also tells you a bit about how the system worked. At the dID site, you fill in as much information about yourself as you like. Each field, like above, fname, is mapped to various possibilities of what that field is called (at other sites). When you are at some other site, on a form page, the form DOM is collected and sent to dID, which is parsed, associated with dID fields, and the real data is sent back, into the proper form fields. Here’s an example:

form_01.jpg

Above is a mock up web site, with two form fields in it. Also in the shot is the Firefox extension. Currently, it displays two options; Button to fill in the form, or a drop down to select which form you want to focus on. If you don’t focus, dID will try to fill in both.
 

form_02.jpg

bullet_1 We drop down and mouse over a form on the page with the name of “search”.
bullet_2 The search form highlights to show us which one it is.
 

form_03.jpg

bullet_1 Ok, that wasn’t the form we wanted to fill out, so we select the contact form.
bullet_2 The contact form highlights
 

form_04.jpg

bullet_1 Now we click on the button to fill in the form. The extension sends the form object back to us, we analyze it, and return associated data.
bullet_2 Data that we have mapped populates itself into the form.
bullet_3 Fields that are not mapped are highlighted to the user so that they can fill them out. If the form fills out 100%, it is automatically submitted.
 

When I was building this, and I saw it work for the first time, I was completely blown away. Don’t you love those moments?

The bookmarklet opened a small version of the dID site. With the popup, you could monitor your information, fill out forms, or contribute to the dID mapping system. For instance, here are a few screenshots:

popupwin-good-ready-to.jpg   Here we see the control panel that is looking at a page that has a form we recognize (noted by the green checkmark). We get a bit of info about the site and form. We also have tabs here so we can easily update our data, prefs, etc.
 
popupwin-unknown-form.jpg   Now we have surfed to a page were dID is not familiar with the form. Maybe there is no form; maybe the form is in flash… In any case, if there is a form here that we are not seeing, the user has the option to report it to us.
 
popupwin-broken-link.jpg   Now we are back on a page with a form we “kind of” know about, but someone has reported it as broken.
 

One other big plan for dID was having a user PIN number, called an idSN, that you can give sites that they would use to get your information from us. They could do away with their forms and request data about you (that you specify is ok for such uses) whenever they needed it. With that, the following ideas were on the drawing board.

  • If you want to unregistered from a service: We can’t guarantee a service will remove you from there system, we can block further requests of your data from them.
  • If you wanted a site to have access to a block of your information for a limited period of time, you could set up an idSN that would expire – you choose data you wish to give and expire time, idSN is generated…
  • Allow site owners to pull info about users that are members of their site. Nothing that is identifiable to a single person, but trends and demographics to make their support of dID worthwhile.
  • Users can report abuses from services accessing their data…

There was a ton of other ideas, all very interesting stuff, but eventually I dropped the project. Once I saw that I COULD do (that’s the fun part to me), I decided the security issues involved with it would be over my head. And yeah, cookies, and browser auto-fills do ‘some’ of this, but that wasn’t the point. The point was it sounded like an interest idea and a cool challenge, and I like those! :)

A sneak peak at my latest personal project

October 24, 2006

I’m really excited about my latest personal project, however, it’s going over the budget a bit – I try to get a working proof of concept done in about a week. However, this is one that I’ve really wanted to do for a long time, so I’m ok with dedicating a little more effort to it. I don’t want to give too much away, and being mysterious from time to time can be fun, so all I leave you with is a simple screenshot.

screener.jpg

Looking Back: The NewsSort Feed Reader

October 21, 2006

I wanted to go back a little and look at a feed reader I created. It was developed early in 2003 if I remember correctly. At the time, I was an avid read of Techdirt. I still am, but back then, that was about the only news site I read on a daily basis. I was really interested in their Corporate Intelligence product and wanted to create something similar.

NewsSort created a social experience around news. Although it is not as open (socially) as digg.com, NewsSort allowed groups to be created with the group creator managing who had access. The thought was to have a company group where co-workers shared stories important to their industry, and communicating about them, which could include sensitive information that would be private to that group. Sounds web 1.0 doesn’t it?

Homepage

01-homepage.jpg

bullet_1 Site stats
bullet_2 Login
bullet_3 Registration
 

Group Page

02-group_list.jpg

bullet_1 Once you log in, you get a list of groups you are a member of
 

Create a new group

03-create_a_group.jpg

bullet_1 You can create your own groups
 

Group Members

04-members.jpg

bullet_1 As the admin of a group, you can manage who has access to it
bullet_2 Typing in email addresses invites new people to your group
 

Group News

05-news_page.jpg

bullet_1 Here is the actual news articles coming in based on selected RSS sources
bullet_2 Each article can be saved to the groups library for later access and commenting
bullet_3 Each group can have keywords that are set to filter the stories coming in
 

Selected Feeds for a Group

06-feeds.jpg

bullet_1 These are the feeds you can choose to get news from. Of course, if I was to set this up today, that it would be open to any feed you wish to use
bullet_2 There was a way to suggest a feed, so that was a start in the right direction
 

Group Keywords

07-keywords.jpg

bullet_1 As mentioned above, each group can have keywords to that NewsSort could filter out items the group had no interest in. I mentioned this was inspired by Techdirt’s Corporate Intelligence, which uses real people to compile important stories for a company, so this was an attempt to emulate that.
 

Group Library

08-library_directory.jpg

bullet_1 Here is a list of stories added to the group’s library
bullet_2 Various info of the story is shown here, such as; Date saved, number of comments, importance (as voted by the group) and category assigned
 

Story with Comments

09-library_with_comment.jpg

bullet_1 The story saved in the library
bullet_2 The voting system used by the group members
bullet_3 The comments left by the group members
 

It was fun to look back at this. There are a lot of projects I started in the early 00’s that I wish I had stuck with (like my online calendar!) and this is definitely one of them. I don’t even recall why I stopped working on this. How do you stay interested in your personal projects?

BTW, I use NewsHutch for collecting my daily news.