I have made a small update to TabMark per Charles Arthur’s request: an “Open in browser” button which will open the selected links in your default browser. I also added a save item in the File menu, so that if you choose to remove some from the list the new set can be saved back!
This has been mentioned before and presented at TagCamp, but I thought I’d finally make an actual post about it.
A while ago, I was using Buzz’s Cocoalicious, and realized that as my list of tags grew, the tag browser became less useful; the alphabetically sorted list didn’t scale.
The problem is there are too many tags in the list and most tags have only one post associated with them (the long tail), making it difficult to find a tag which will result in a useful set of posts. Additionally, making a multiple selection to find intersections usually resulted in empty sets, since I didn’t have a good sense of which intersections would work. Since Cocoalicious is open source, I decided I’d try to make a better tag browsing interface.
The main goal was scalability, but it took several iterations (and In-N-Out burgers with Buzz) before that was fully realized. Here’s what the final version looks like:
The new tag browser uses a button grid, similar to GarageBand’s loop interface. Tags are sorted by their post count, thus more relevant tags are always found at the top, keeping scrolling to a minimum. When a button is highlighted, all related posts are displayed in the table below, and at the same time tags in the tag browser which do not intersect the selection fade away while related tags bubble up to the top. Beyond being a slick effect, the animation gives a nice visual cue as to where the next location of the buttons are and helps identify relationships between tags.
This interface scales quite nicely; each click cuts down the tag list significantly, and the bubbled-up tags are physically close and always related, so searching and scrolling is rarely required. It also works well for exploring the “long tail,” since the previously insignificant tags eventually come to the top. Dare I say, using it is a lot of fun! Here’s a video of it in action:
click to download the 3.7 MB quicktime video
A few less noticed features are that tag browser has full keyboard navigation and type-ahead, and the button grid can be sorted alphabetically. The animation effect itself is fast and can run well even on my 800 Mhz iBook.
Overall, I’d say my new tag browser is a vast improvement, and should make it into a Cocoalicious build in the near future.
UPDATE: Buzz talks more about some of the design issues.
It looks like the WebKit folks just checked in a cool new tool for browsing the DOM. It looks to be a slick and infinitely useful utility for web developers, but what struck me the most was that the HUD-style window and widgets would be open source for all Cocoa developers to use! Well, I thought wrong, most of the HUD interface was done in HTML (WebKit/WebInspector.subproj/webInspector/inspector.html), but the artwork would probably provide someone a good starting point for developing HUD (sub)classes.
The preceding was an example of how I use NetNewsWire. Space moves to the next unread item, and return will open a new browser tab in NetNewsWire that will load its associated web page. When I am finally done scanning through all unread items, I’ll then go through the browser tabs I’ve opened and read the article. Or, so I try.
Often I will be too busy, too distracted, or too lazy to read all the pages I have opened. A blessing or a curse, NetNewsWire’s persistent tabs pile up to an insurmountable stack. This eventually reaches the point where it begins to slow down NetNewsWire’s launch time, and in the case of syncing to another machine, the entire app grinds to a halt as it attempts to load every new tab it has discovered.
It was such a situation I was in tonight, when trying to sync 87 browser tabs to my 800 Mhz iBook. After about 5 minutes of waiting, I decided it would be best to offload the browser tabs so I wouldn’t be in the same position again. I started a race to see if I could create an app that would import my NetNewsWire tabs into Safari bookmarks before my iBook finished loading.
I lost the battle, but won the war (in only 62 lines of code, no less). Say hello to TabMark:
Here’s how you use it:
Like all good Web 2.0 software, TabMark is in an eternal beta, and is provided “as is” with no guarantees.
Today I released HyperEdit 1.5! HyperEdit is my live HTML and PHP editor with W3C validation. The new version has the following changes:
Overall, I think it is a great release which adds many requested features and fixes lots of bugs. Please contact me if you run into any problems with the new version.
I just thought I’d give a shoutout to a new blog, ridiculous fish: serious code. The author used to be on my team, and definitely knows his stuff :-). Hopefully lots of good entries will be forthcoming!
I think when Google Video or Yahoo Video displays results, the poster image should turn into an animated version when the mouse hovers over. Obviously, it doesn’t need to stream the whole video, but showing a different key frame each second would be pretty effective. A timeline a the bottom of the image would make the frame jumping less disconcerting to the user.
I’ve decided to whip up a little example:
I think this works reasonably well and gives more data to a user than just a static frame. A nice improvement to my mock-up would be to have the current frame in the animation stay in view when the mouse leaves the area, instead of jumping back to the first/poster frame. I didn’t feel like getting my Javascript voodoo on tonight to do that.
I’d imagine their algorithm to find a good poster frame is based on confidence, so they could either choose differing frames with the next highest confidences, or split up the video into 5 or so parts, and choose the frames with the best confidence from each part to display.
Andrew Wooster, Minister of Search:
The projection map table was basically a large touch screen table which allowed people to manipulate a globe-like map by touch, zooming in and out and overlaying different satellite and topographical data sets.
It seems that Northrup Grumman put together an interactive tabletop for military cartography and simulations. There’s a pretty cool demo video on their site.
This reminded me of my research at Purdue: the Mixed Reality Tabletop (MRT for short). The main difference between the two setups is that the Northrup Grumman table uses touch sensitivy on the table itself, wheras we opted to used a camera mounted overhead and analyzed the video to detect actions. This meant we had to worry about lighting conditions, shadows, and camera calibrarion. Our system was really designed to be a collaborative medium where two people could share the same tabletop, so the camera was a natural choice to use for such purposes. I think the videos on our site show that the image detection method can work well and allow users to perform advanced operations such as drag-and-drop of virtual objects (due to Dan Belkins’ great work). Of course, the other real advantages of MRT is that it costs 100 times less than the Northrup Grumman system, and you can play games such as Networked Tic-Tac-Toe and Pong on ours (my work!).
In light of WordPress controversy, I have come to realize that conducting business ethically is truly in the best interest of the business itself. The WordPress community has suffered a serious blow, one that could have easily been averted if the founder would have been more upfront about his revenue streams. I do not want to see HyperEdit tarnished in the same matter, so I’m going to be upfront about one of the slightly-less-than-ethical techniques I use to increase HyperEdit sales. People often tell me how much they love HyperEdit. While I’m definitely flattered, this comes as no surprise to me.
Anyone who has seen Saved By The Bell knows of the episode where Zack puts a subliminal message in a tape for Kelly Kapowski to try to convince her to go to a dance with him. The point of a subliminal message is to use the power of suggestion in a way not conscious to the person, but that still gets processed by their brain. Zack used a frequency spectrum that went unnoticed because the brain receives the signal, but filters it out.
HyperEdit uses a similar technique, but with vision. In order to increase sales and win the hearts and minds of my users, I have embedded an image in the preview pane of HyperEdit that says, “I love HyperEdit!” (“I,” instead of “you,” because studies show the message should be written in a way that the user would say it themselves). Because of how it is displayed, the brain filters it out, but the suggestion still gets embedded in the subconscious. Here’s a snapshot of what it looks like:
As you can see, the image is very light and blurry — barely noticeable. It actually only gets displayed for one frame every 5 minutes, and is synced to the monitor’s refresh rate. Thus, if your monitor has a vertical refresh rate of 75 hz, this image will be displayed once every 22,500 frames in a span of 5 minutes. Since the human eye cannot perceive much beyond 60 hz, the small flash gets filtered out by the brain. The risk of people noticing it is further diminished by the fact that most people when using HyperEdit focus on the editor pane, thus the preview pane is still slightly out of focus.
So, if after using HyperEdit, found yourself in love with the little app, I’m sorry to say it isn’t because of its usefulness, but because of my unethical business practices. Depending on how the community reacts, I may remove this feature from the next version. Hopefully being upfront about this will avert any crisis.
