about:profile – Analyzing Data in Firefox

Ed Lee

7

The Prospector team has always been interested in analyzing the data stored locally to an instance of Firefox to experiment with improved interfaces that leverage that data. Previous prototypes have focused on both processing data and changing the interface in a single add-on, but the team sees a benefit of splitting apart the two because more people can get involved and brainstorm ideas of what can be done with each individual piece.

Focusing on the first piece, we would like to get your input on how the data in Firefox should be analyzed. There is a lot of existing data in Firefox such as titles of bookmarks, auto-completion for forms, times you’ve visited pages, cookies from sites, and much more. And even focusing on just one type of data, there’s many ways to analyze it.

We’re releasing about:profile to get the conversation started. It only looks at the domains of pages you’ve visited and references them with two packaged sources of data: ODP categories and Alexa siteinfo. All the analysis is done within the add-on and no data is sent out from Firefox, so you can take a look at about:profile even when offline.

Overall categorization and detailed/recent interests

As a proof of concept, the exact details of how we combine the data isn’t too interesting, and we don’t expect the visualized results above to be accurate for everyone. But briefly, about:profile shows your overall browsing interest based on the top-level ODP categories, your largest sub-categories given all the domains in your history, the largest increases of sub-category interest over the last few days, and estimated demographics for the domains visited.

We would like your input on other ways to analyze data in Firefox, but also keep in mind the goal is to improve Firefox while supporting Mozilla’s principles of openness and user privacy. You can install about:profile without restarting Firefox, and it’ll open a tab with a user profile based on your browsing history. Take a look at the visualization and click around to see if that triggers any ideas.

Next week, we’ll focus on the second piece of using the data to improve Firefox. For example, Firefox currently analyzes browsing patterns to make the AwesomeBar super-smart with predictive suggestions for where you want to go.

As always, you can check the source on Github, provide feedback, and submit issues or suggestions!

- Ed Lee on behalf of the Prospector team

A New Way to Control Printing Output

bdahl

4

An experimental API for printing has landed in Firefox 18. The API’s creation was driven by the needs of pdf.js and was designed by Robert O’Callahan and Julian Viereck and implemented by Julian and I.

Problems

  • How do you print a pdf with hundreds of pages?
  • How do you get high quality output?

Solution

mozPrintCallback – A new callback for canvas that is executed during the printing process. This callback can access the printing canvas context and perform any calls that are normally done to a 2D canvas context. When the callback is finished with rendering it must call printState.done() to tell the printing code to advance. The benefits of this approach are: 1) we don’t have to try and render every page before print, 2) the output gets rasterized later in the printing process where it should be. (This is not available for all platforms yet).

Example

Feedback

As I mentioned above, this is still experimental and currently only available in the Nightly (FF18) version of Firefox. However, we plan to propose it as a standard since we think it has many interesting use cases outside of pdf.js. We’d love to hear your thoughts. Is this useful? Is there anything you’d change or add? Please share your feedback here via comments or in the mailing list.

WebGameStub, or, So You Want a Quick Start on a 2D Canvas Game

Dan Mosedale

Today we’re releasing WebGameStub version 0.2. It helps you get a quick and easy start on writing an HTML5 game with 2D canvas with a simple template and a few tools. WebGameStub offers a good starting point for the game itself and smoothes off a variety of the rough edges associated with writing and publishing a Web app.

WebGameStub is about saving you time and effort so that you can focus on writing your game. It’s about not having to write the most basic game infrastructure pieces, like canvas setup and an update/render loop. It’s about having an easier starting point than empty HTML and JS files. It’s about not having to spend your time stitching together the usual cross-browser bits associated with bootstrapping an app on the web.

Simple canvas game, courtesy of Matt Hackett and Lost Decade Games.

What WebGameStub 0.2 Gets You

  • A simple update/render loop and canvas, based on the game above
  • A copy of the example game that you can inspect and extend
  • Links to helpful game docs, API docs, and open art resources so you don’t have to hunt for them
  • HTML & CSS based on HTML5 Boilerplate for speed, robustness, and futureproofing
  • (Optional, requires node.js): automated optimization, deployment to github pages, and library installation with volo

Here are a few examples of what one can build using this template: a snake game built by Frederick Wenzel at the recent MDN hack day as well as an extended version of the example goblin game where one shoots at Twitter avatars.

Getting Started

If you would like to start working on a game, and have some experience with web development and JavaScript, give WebGameStub a try. The README on Github is a good place to start.

Feedback and Helping Out

Your feedback on how WebGameStub was helpful (or could have been more helpful) in starting a simple web game would be tremendously valuable in helping make it better. Please let us know how it went by opening a github issue or leaving a comment on this blog. We’re also often available in #games on irc.mozilla.org.

More Info

-Dan Mosedale, on behalf of the WebGameStub team (Alan Kligman, David Perit, James Long)

Introducing Gladius 0.2

alan
Physics example from the galleryToday we are proud to release the next version of our open-source Javascript game engine, Gladius 0.2. For this release, we focused on making the API more intuitive and improving modularity.

 

The driving goal for these changes is to make it easy for developers to customize the engine for their projects and to share their own engine plug-ins with the Gladius community.

 

Community-driven

Gladius is an experimental, community-driven Mozilla project, and seeing more people join is a great source of energy and motivation for us. For example, Chris Strom jumped into Gladius a few weeks ago  and has been writing a great blog series about his experiences. Chris is helping us identify areas for improvement in the API and spurred us to fix up some outdated documentation to make it easier for new developers to start using the engine. We also have an awesome start on high-level documentation for Gladius thanks to Michael Kelly.

 

Engine plug-in support, updated documentation and more

The biggest update you’ll notice in this release is support for engine plug-ins through a new extension framework. It’s now much easier to add new functionality to the engine by writing an extension yourself, or by loading an existing extension from github or the Web.

 

We’ve also updated READMEs and new examples that will help you get started with Gladius. They demonstrate how to load the engine and illustrate functionality in the default extensions. The default extensions, along with all the examples, are available here. See the examples in action in our new gallery.

 

Get involved

We would love for you to help with Gladius by trying it out yourself or by helping to build out the project. We’re available in #games on irc.mozilla.org to help you get started, and we’re especially keen to feature more community work in the gallery.
Some specific areas where you can get involved:
  • Create a new example or make an existing example awesome
  • Contribute to our growing set of documentation
  • Put together a simple game

You can get started by heading over to github and cloning the repository or downloading the archive.

What’s next

Our next release will focus on making it easier to get started with Gladius by building out more documentation and examples, and by continuing to improve API usability.

Alan Kligman, Dan Mosedale and David Perit, on behalf of all the Gladius contributors

Changing the world with WebFWD

Havi Hoffman

If you’re an entrepreneur developing the next generation of web technology
and you support Mozilla’s mission to promote openness, innovation and opportunity on the Web, you should know about WebFWD.

After a year of evolution, iteration and growth, we’ve relaunched with a new program and a redesigned website, strongly focused on mobile first and designed to transform closed markets and create new ones. Relocation is not required, but code and commitment are.

Please check out our 12-week lab, apply for the upcoming October 2012 session, or help get the word out.

    Here’s a look at the highlights:

  • Ongoing coaching, collaboration and access to Mozilla experts and thought leaders
  • Office hours with industry experts
  • Interactive learning with access to dedicated specialists, focused on designing your business/releasing your product
  • Opportunity for follow-on funding by Mozilla upon completion of the program

Pitching to Mozilla in Ten Forward (Entropy Wave)

Exploring navigational search with blekko

Ed Lee

Test Pilot data shows that users often search for the same thing multiple times, and this is likely because the user isn’t searching for something but actually “re-searching” to navigate somewhere. Search engines already optimize for this situation by helping browsers prefetch the page because they have high confidence the user will click on the first result.

The Prospector team has a new search experiment to help streamline this particular browsing pattern. Right now a user types out a whole word in the search box, performs the search, and then clicks on the first result on the search page before interacting with the page. Instead of showing the search result, Firefox can take users right to where they want.

However not all searches are used as navigation, so we would want to make sure search results are shown in those cases. For this experiment, we have worked with blekko to keep the user informed about what is about to happen, so when the user is typing in the search box, each word completion comes with the icon for the page when blekko believes it’s a navigational query. Otherwise, for searches that require a list of results, the blekko icon appears next to the completion.

Completions for navigational searches with preview

Additionally in this experiment, we try to save the user from typing unnecessary keys. This is achieved by automatically selecting the first word completion and also automatically showing a preview of the page. So now when a user wants to “search” for Facebook, after typing a single letter f, “facebook” is already selected from the list and the page is already loaded. This immediate feedback reassures users that no additional typing work is necessary to go where they want.

While the current experiment just simply provides a preview of the navigation result, future experiments could provide a simple way to switch to the search results page. So the default-selected preview tab would automatically show the page for the navigation first result, while another preview tab could contain the search results, and other tabs could have lower-ranked results or even search result listings from other search engines.

Try out our blekko search experimental add-on in Firefox! You don’t even need to restart Firefox to begin playing around. The Prospector team is very interested in hearing back from you, so please install it for a bit, and let us know what you think and submit issues or suggestions on github! If at any point you want to stop this experimental add-on, you can simply change your search engine or disable the add-on.

- Max Zhilyaev on behalf of the Prospector team

Introducing a Minimalist HTML5 Game Template

Dan Mosedale

4

Today, we’re releasing version 0.1 of an HTML5 game template (the github repo).  This template provides basic infrastructure so that as a game developer, you don’t need to do a bunch of busy work to get started: you can hit the ground coding.  As no particular engine or  framework is assumed, it is usable for any sort of game.

More details, from the README.md:

Fast Start

Easy to Build & Deploy

  • Builds minified game configured for browser appcache using UglifyJS and almond.js
  • Trivial to deploy to a live server (currently supports github-pages)

Default Best Practices Help Your Codebase Scale

  • Structured for maintainability using RequireJS
  • Includes pre-configured QUnit test harness

Easy to Specialize

  • Higher-level, specialized templates can easily be built on top of this. We will build one specifically for the Gladius engine  in the near future.  One could imagine others like a side-scroller  template, or a simple canvas game for new JS developers.

See the “let’s get started” documentation to get a quick sense of how it all fits together.

Note: This template is currently focused entirely on the browser-based pieces of a game. Making it easy for a game to offer a Node-based server-side component is likely to be in scope in the fairly near future.

Your Thoughts & Feedback

We’d be grateful for all feedback about this template, whether in blog comments or github issues, or pull requests.  To help make this template more useful, we’d especially love to get your thoughts on a couple of specific issues:

  • Would you prefer to be responsible for your own game loop, or would you prefer to use a default gameloop provided by the template?  Please add comments to this github issue.
  • If you’ve worked on an HTML5 game, what did you find to be the most annoying hurdle when getting started?  Please add comments to this github issue.

Next Steps

We’ll be evaluating the feedback we get, prioritizing issues into the 0.2 github issue milestone, and then digging into another iteration, to be available in the next several weeks. Feel free to join us in IRC in #games on irc.mozilla.org if you want to discuss further.

Web FWD Spring Summit: Teams Pitch Today

Havi Hoffman

Today is Day 4 – the closing day of WebFWD’s Spring Summit. Join us live today to hear from BigBlueButton, CASH Music, Entropy Wave, iHeartCode, OpenPhoto, Synbiota and Tomahawk.

Representatives of seven WebFWD teams arrived in Mountain View late last week to participate in an intensive four days of learning, sharing and collaboration. They’ve come from as far away as India and Ecuador; from the UK, Belgium, Germany, and Canada; from Brooklyn, NY; Portland, Oregon; and from San Francisco and the Bay Area. Like Mozilla, many of the teams are geo-distributed, and a couple teams include founders from more than one country.

On Friday, the teams spent a day in workshops with expert Mozillians like Diane Bisgeier and Jane Finette (engagement); Jennifer Morrow aka Boriss and Brian Dils (user experience); Myk Melez, Anant Narayanan and Fred Wenzel (software development), Jim Cook (finance), and Pascal Finette, the wizard of WebFWD – diving into all the elements of product development: from design and code to marketing and business strategy.

Day 1 ended with an evening mixer in Ten Forward (where else?) and the following morning the teams were back for a long day’s hacking, an open work day that included drop-in participation from dozens of friends of WebFWD and a variety of Mozillians who came by to co-work. That was Day 2, fueled by coffee and bagels, pizza, sweets and caffeinated beverages — and livestreamed via WebM over Air Mozilla.

WebFWD Spring Summit: Open Work Day

Sunday, Day 3, began in Mountain View and ended with an outing in San Francisco and a sundown stroll on the Embarcadero. The teams focused on preparing 30-second pitches. They rehearsed and took feedback and questions from each other.

You can hear their pitches today at Mozilla’s weekly all-hands meeting via dial-in or live-stream. Hope you can make it!

Gladius, a Modular 3D Game Engine for the Web

Dan Mosedale

The Gladius team at Mozilla is releasing version 0.1 of our open-source 3D JavaScript game engine for the browser. Gladius is designed to help people write great 3D games for the open web.

What we’re releasing today is an early prototype, intended to get people’s eyes on the code, APIs, and examples as we continue to iterate. Key features of the engine for this release include an entity/component framework, WebGL graphics rendered with CubicVR.js, and 2D physics based on box2d.js. Modularity and extensibility are strong design objectives and are supported by require.js.

This release includes a standalone math library, which is the first in a set of tools and libraries which will be generally useful and reusable in other projects.

In order to be sure that the engine will be powerful and capable enough for rich, interactive 3D games, we’re collaborating with Andor Salga on a game-in-progress based on the No Comply WebGL demo. It continues to be immensely helpful as a vehicle for demonstrating how the individual pieces fit together as well as in surfacing issues with our APIs.

One thing that we’re hoping to get from this release is API feedback about the asset loader. That API is currently entirely callback-based and we’re curious whether game developers find that comfortable, or whether something that uses promises would be preferable. Please direct feedback either to this github issue or find one of us in #games on irc.mozilla.org to chat further.

More information is available on github, including a link to our short and medium-term roadmap along with the code, some examples, a tutorial, and various ways to get in touch.

– Alan Kligman and Dan Mosedale, on behalf of all the Gladius contributors

Up and coming: TL;DR Conf

Havi Hoffman

Henrik Bennetsen, long-time organizer of WebGL Camp, is hosting TL;DR, an intimate single track conference, which takes place in San Francisco on March 30, at the Mission Bay Conference Center. TL;DR (@tldrconf) is a one-day event designed to explore the post-PC technology landscape driven by mobile devices and HTML5, and the entrepreneurial opportunities that arise as technologies evolve and shift.

Speakers include Mozilla’s own Pascal Finette, Director of the Open Innovation Group and WebFWD; Floodgate Fund’s Managing Partner Mike Maples Jr.; SoftTech’s Charles Hudson; Scott Jenson from frog design; Luke Wroblewski, digital product designer and consummate ‘mobile first’ guy; and trail-blazers from a range of disciplines.

TL;DRconf is offering a limited number of discounted tickets to the Mozilla community. Register now with the following code to receive a 20% discount:

MOZ@TLDR

Expect insights and great conversations. Hope you can join us there.