For a while now we’ve had a system we’ve used internally to send messages to our users in the search sidebar. We’re able to tweet a link and have it appear in the sponsored section at the top of the sidebar.

Some partners such as OneRiot have also used this to get the word out about breaking news. Now we wanted to let any of our users take advantage of this ability to tweet out cool links and get them on Google, Yahoo and Bing straightaway. We hope people will use it to break news and advertise cool products.

You’ll need to pay $5 to get started with an account, but for the next couple of weeks, while we’re in beta, that will get you as many page impressions as we can serve – up to 300,000 per day though you’ll have to share that with other AdTweeters. In any case you won’t have to reload your account until we’ve shown at least 5,000 impressions of your text ad and link.

Here’s how to get started:

1) With WebMynd for Firefox installed go to:

http://www.webmynd.com/credits

2) Once you’ve confirmed your Twitter account, click on $5 to load up your account using Amazon payments.

3) From the Twitter account you registered, tweet out a link like this:

@_wm_publish 5000 Get your link here http://blog.webmynd.com

Obviously you can use your own text and link. 5000 is the number of impressions that you’re “buying” but remember you can pick any number and you won’t be charged for them for the next couple of weeks while the beta trial is running. You must include @_wm_publish though.

You can go back to the credits page to see the number of impressions that have been delivered, keep track of your AdTweets, and add funds to your account.

Please let us know how you get on!

The ‘Air’ design by Chan Karunamuni has won the RedesignGoogle competition.

Air by Chan Karunamuni

Chan wins a MacBook Air which will replace his “trusty 2006 Macbook Pro, becoming my mobile satellite for surfing and designing on the go.”

We created RedesignGoogle so you could personalize the appearance of the Google search results page. The design hasn’t changed for ten years and we wanted to seek out the best ideas for innovation by running this competition.

Chan says: “Google spends a lot of time tweaking their front page when they really should be working on their results page, which has stayed the same for about a decade now. I had a few ideas floating around of what Google might look like in 5 or 10 years, so I decided to attempt to implement them within the constraints the contest provided… it’s a dream project: who wouldn’t want to take a shot at redesigning the most popular digital service in the history of mankind?”

“The goal behind Air was very simple: to reduce as much visual noise in the original design as possible. For example, the menu doesn’t appear until the page thinks you want to make a new search, based on your mouse location. The search button doesn’t clutter the header unless you’re editing a query, and all secondary information in the results is out of your way until you need it.”

Other popular and highly-ranked entries were Go Ogle by randsco, which has a more risque take on the future of search (with the help of Alena Seredova), whereas Plex by Peng Zhong is described as “Google torn apart and completely rebuilt from ground zero.” and came a very close second.

GoOgle by randsco

Plex by Peng Zhong

Thousands of entries were submitted to the RedesignGoogle gallery. A shortlist of 13 was compiled based on users’ votes, comments and number of downloads of each design. Then these were judged by Jason Kincaid (TechCrunch writer), Paul Graham (Y Combinator partner) and Imran Zaidi (WebMynd design lead) to determine the winner.

During the competition, we launched a new feature which allowed the designers to add Javascript (including use of the JQuery library) to their designs so it is no longer just re-skinning Google with CSS, but also adding functionality. The ‘Air’ design takes advantage of this with its Twitter-like paging: click the arrow at the bottom and the next page of results is loaded right there.

WebMynd Sidebar

As well as letting you change the appearance and function of the Google search results page, the WebMynd browser addon (which powered the RedesignGoogle competition) adds search results from the sources you most value in a sidebar to the right-hand side of search results pages.

The future of the RedesignGoogle gallery will be to let designers not only change the appearance and function of search results pages, but also add new results and even change the ordering of existing ones.

You can see our moves in this direction with our own experimental interfaces – first we launched Phoenix:

Phoenix

… and then Manhattan and Osaka. Thousands of our addon users have adopted these interfaces for their day-to-day searching.

We look forward to seeing how people innovate with our new features… watch this space!

We’ve just released version 0.9.2 of our Firefox add-on and it features some major performance improvements, plus a new customizable sharing screen. Switching between the search and sharing sidebars is much faster now, and the sharing sidebar now lets you share links on a wider variety of sites, including Tumblr, Posterous and LinkedIn.

We’ve also upgraded to jQuery 1.4 and fixed a number of minor bugs, so you can expect a faster and more stable user experience overall. Install WebMynd 0.9.2 to try it out for yourself, and as always, please contact us if you have any questions or comments.

Some users have reported that when they open new windows, the window appears blank and the urlbar empy whereas they were expecting them to open with content. For example, when clicking within an internet banking account to view a cheque image, or using right-click Open in New Window.

The problem is caused by a bug in Torbutton 1.2.3 which clashes with WebMynd. This has been fixed in Torbutton 1.2.4 – download the fixed version here.

You can read more about the problem in the bug report.

A number of users have reported a conflict between the latest version of WebMynd (0.9.1) which was released on addons.mozilla.org on Tuesday and various toolbars. The main symptom is that custom buttons from other addons that are usually displayed in the urlbar disappear after install.

We’ve now fixed this problem and you can download a fixed version of  0.9.1.1 by clicking here.

Prior versions of WebMynd don’t have this issue. We will release WebMynd 0.9.2 with this fix included on addons.mozilla.org next week after our testing is complete. That release will also include great new sharing features and performance improvements as well as bug fixes.

For the technically minded, the problem was caused by including the jquery 1.3.2 library in our addon overlay xul file. For some reason this causes toolbar buttons to disappear. jquery 1.6.2 works fine and we found the fix to allow us to continue using jquery 1.3.2 here:

http://chrispederick.com/forums/viewtopic.php?id=2374

As the RedesignGoogle gallery has continued to grow, we’ve been working on ways to make our tools more flexible for designers and more compelling for users. So far, RedesignGoogle has only allowed designers to modify the style sheet of the Google results page, but we’re taking that a huge step further: designers can now embed JavaScript in the page, and the truly excellent jQuery library is included in the add-on. Rather than simply reskinning Google results, designers now have the power to remake every aspect of the user experience, and we’re excited about the possibilities this opens up.

Below are a couple of simple examples (and code snippets) of what Google redesigners can create with jQuery. But first, a quick note about the RedesignGoogle competition: over the last couple of months, we’ve been running a contest to find the best user-submitted design and award the designer a MacBook Air. To make sure entrants get to make the most of the new features, we’re extending the contest deadline to January 1, 2010, and we’ll announce the winner two weeks later. You can read the full rules here.

Infinite Scroll

It makes a lot of sense for Google to only load ten results at a time — the fewer results are loaded, the faster your search — but there’s not a whole lot of sense to the way they force you to click through results pages. More than anything, it’s a vestige of last-century web design that no one’s bothered to change. What if instead of needing to click “next” to go to a separate second page results, the second group of ten results simply loaded in place when you scrolled down to the bottom of the page?

First, you need some code to detect when the user has reached the bottom, as well as a div to load the new results into:

$(document).ready(function() {
  $(window).scroll(function(){
    if ($(window).scrollTop() == $(document).height() - $(window).height()){
      loadMore();
    }
  });

  start = 0;

  $('<div id="tempresults" class="moreloaded"></div>').insertAfter("#res");
});

The code above calls the loadMore() function when the user scrolls to the bottom of the page. It also appends a new div to the results section, and initializes a global variable, “start”, which will come into play later on.

Here’s what loadMore() looks like:

function loadMore() {
  start += 10;
  var nextlink = $("#nav tr td:last a").attr('href');
  var currenturl = window.location;
  url = currenturl + '&start=' + start;
  $("#tempresults").load(url + ' #res');
  $("#tempresults").attr('id', 'oldtemp');
  $('<div id="tempresults" class="moreloaded"></div>').insertAfter(".moreloaded:last");
}

The function begins by incrementing the “start” variable by 10; the variable signifies how many results have been loaded already. The results are loaded into the tempresults div via an AJAX request, and a new tempresults div is created.

You can see infinite scroll in action by installing this design.

Find As You Type

We thought it would be cool if Google updated its results as you type, the same way that, say, iTunes does. This design will do exactly that. It works by binding two functions to the “focus” and “keypress” events on the search field:

$(".lst").bind("focus", function(e){
  var currentTime = new Date();
  thisKeystroke = currentTime.getTime();
});

$(".lst").bind("keypress", function(e){
  var currentTime = new Date();
  lastKeystroke = thisKeystroke;
  thisKeystroke = currentTime.getTime();
  timeSinceLast = thisKeystroke - lastKeystroke;
  if (timeSinceLast < 600 && searchEvent != null) {
    clearTimeout(searchEvent);
  }
  searchEvent = setTimeout("updateResults();", 600);
});

Basically, every time you enter or delete a character in the search field, the search function, updateResults(), will be told to execute in 600 milliseconds. If you press another key before the search executes, the search is canceled and a new search is scheduled. We need this to make sure we don’t send too many search requests — sending lots of requests per second will make Google think you’re an automated search robot, and it’ll temporarily shut off service.

updateResults() is pretty simple:

function updateResults() {
  var url = '/search?' + $('#tsf').serialize();
  $.get(
    url,
    {},
    function(data, textStatus) {
      $("#res").replaceWith($("#res", data));
    }
  );
}

This function uses jQuery’s built-in AJAX and form serialization tools to execute a search and insert the new results into the page.

Hopefully these examples demonstrate how easy it is to make major changes to Google’s search interaction with just a few lines of code. We’re really looking forward to seeing what the community can come up with. If you need help with the details, check out the jQuery docs. Happy coding!

One of the most common bits of feedback we’ve heard from our users is that the WebMynd add-on makes search results slower to load. Nothing is more important to search than speed,  and this has been a source of irritation for us too. So it was the first thing we set out to improve with the new version of the Firefox add-on.

We’ve totally revamped the search sidebar and moved the customizable search tools to a separate pane in your browser:

The sidebar pane automatically opens when you do a search, and hides itself when you navigate away from the search results page. Google will now be as lightning-quick as always, and your WebMynd tools will load noticeably faster as well.

Install WebMynd 0.9.1 to try out the new sidebar, and be sure to let us know what you think.

The rules for the RedesignGoogle competition are now up. You can read them here.

One of our key goals at WebMynd is to give you more control over your search experience. Our first steps toward that were to outfit our add-on with our own set of customizable search interfaces. Now we’re excited to announce our next step: RedesignGoogle.

RedesignGoogle lets you completely customize the look of Google Search by installing user-submitted designs from an online gallery. A stripped-down version of the WebMynd add-on applies your installed stylesheet whenever you’re on a Google search results page. (You can enable WebMynd’s other features if you like, but they’re turned off by default.) Currently, RedesignGoogle is available for Firefox, and we’ll be releasing versions of the add-on for other browsers soon.

If you’re a designer, this is your chance to revamp the most widely used service on the web. Anything that can be manipulating using CSS can be changed with RedesignGoogle; here are a couple of examples of what’s possible. We offer a web-based CSS editor for creating and previewing your designs, but you’re free to use your preferred tools — just paste your stylesheet into the editor when you’re ready to apply it to your own searches and publish it to the Gallery.

Most exciting of all: we’ll be holding a competition to find the best user-submitted designs. The winner will receive a new MacBook Air; runners-up will get something cool too. Designs will be judged by Paul Graham, the WebMynd team, and a few others TBA. Stay tuned for more details and official rules.

Available in the new 0.9 release of the WebMynd Firefox add-on are two new experimental search interfaces, Manhattan and Osaka:

These new interfaces were designed based on some of the feedback we received on our first experimental interface, Phoenix. In contrast to Phoenix, which minimizes visual clutter by only presenting the top three results from each of your selected sources on the main screen, Manhattan and Osaka display all your results within scrollable frames in a magazine-style layout. The idea is to let you browse the most possible information with the least possible interaction.

We’re just getting started with these features, and there’s a lot of work yet to be done. But we hope that by offering new kinds of search experiences we can help improve one of the most important (and often most frustrating) aspects of using the web.

Install WebMynd 0.9 to try our new interfaces on your own searches.