Category: Events

including conferences and workshops

MozFest 2012: Mark Surman on Where Next to Webmaker

Story of Webmaker

4 years ago, where Mozilla has always been clear about its mission. Guard the open nature of the internet. Firefox, for example, was not a browser but a standards play (vs. IE).  The approach was to make a product that people would love to embed a set of value to bring the web platform back.

Can’t just win one thing. What is beyond Firefox? Started a product oriented lab. It came to the idea of FirefoxOS. It’s doing what Firefox did for browsers with mobile. Drumbeat was also set for the more social side in terms of engagement, which came to webmaker.

A platform is not enough to make that writeable web. Need to teach people how to write. Based webmaker on three theories:

  • Best way to get writing is to teach people.
  • Learning is social. Connecting people.
  • Tap into the internet culture.

First part was to build the tools: Thimble, Popcorn Maker. Second part was Summer Code Party which asked people to get together to make and learn (the social side). 650 events in 80+ countries with almost no planning.

What we learned:

  • projects based on popular themes are popular e.g. Thimble lolcat editor (vs. edgecase animals)
  • people have a lot of content online e.g. Popcorn Presidential Attack Ad – by signing in Facebook; Concert video using music and their own pictures
  • Self-identify as educators: Those who want to teach are the first ones to get it. Need to build an army to make a permanent Summer Code Party everywhere.

Existing Popular Ideas to Turn into Starter Projects

  • collaborative scrapbooking
  • viral dubbing
  • wish list from social network putting back out
  • school year book
  • school projects – templates
  • infographics
  • e-cards

Building a Permanent Summer Code Party

  • network on how to build summer code party
  • have more regular ones
  • mentors, ambassadors
  • badges as connectors
  • how to do it without access to web
  • localization

I’ve heard there’s an etherpad with further notes, but no idea what the link is…

MozFest 2012: Opening Circle Day 2

Mark Surman

The theme is creating a writeable society. Need a web that allows us to write, not just read.

MozFest is about inventing that future.

This is a place where we can do it.

Popcorn

Brett Gaylor

Announce the release of Popcorn Maker 1.0 with a screencast.

Wanted to work with people to who co-create the media of the future. At MozFest 2011, PopcornJS 1.0. One release a month to make Popcorn Maker.

Let’s Get Making.

Back to Mark

It’s making an open source cinema.

A whole world of social media that can hack. The next one is to make games that can be hacked. Check out Hackable Games, such as HTML5 2D Hackable Games.

Ukie

Games are awesome

It’s a huge multi million dollar business. It’s a massively growing business. Most people think about console games, which is a strong part, but the games industry is shifting. It’s becoming more accessible, because technology is changing to make it easier to make games.

Games are powerful in learning, provoking people into action, fun. Can teach about failure, collaboration, hard work, anything and everything.

The whole industry is very young, but built on people who could tinker with code. However, we’ve moved away (for the most part) from encouraging people to create with the building blocks, to solve problems. Some good examples are Scratch and Ouya (hackable console).

We must learn not just how to use programs but how to make them… Program or be programmed.

Get excited and make things.

Back to Mark Surman

At the core of Mozilla’s is to focus on learning. Understandability needs to be integrated so that programming becomes something that everyone can do. Popcorn is a start, and games is the next step.

It’s not sure about shipping a cool product, but also an attitude. Need to bring playfulness, which is what games do.

Joi Ito

Interest-driven learner who found a community through the Internet, but did not have teachers. The tools are now available so that anything can make things.

What we’re doing is very disruptive, because everything we do is political and what we do is scary. We empower others, and it’s great to be fun, but there are people trying to shut us down. We win by creating a movement.

We have to fight to keep the internet open.

Back to Mark

The one punk rock kid in Northern Ontario. What punk rock gave Mark was to make media. Made media with magazines, scissors, and glue.

It’s an attitude that injects fun and builds that movement we need and are. We should build that attitude into everything we make and offer.

That attitude is what is going to bring people in.

F*ck it. Ship It.

MozFest 2012: How to Work Open

by Matt Thompson (absent), so actually Gunner

Processes & Tools

The process and tools, and how things are done should be open. Etherpad – like a google doc. Collaborative, and in Mozilla, tied to conference calls.

Give guidelines, not direction.

Open Philosophy

Some are a little open, but to be truly open, everything is open not just the nice looking bits. For example, the Firefox mailing list is open. The discussion on Chrome “kicking their butts” was a public discussion.

Need to pro-actively report out, especially for offline conversations.

Community

If you’re going to work in the open, it’s about the community. Have to ready to share: ownership, control, everything.

How to contribute from day one. Make a wishlist (e.g. documentation, testing – never done). Ask for things to be added to the wishlist.

Have core community values.

Motivations

  • Pain
  • Passion
  • Fame
  • Fun

Having a Narrative

Naming the contributors, and having an ongoing story.

Give other voices a channel. Invite others into the narrative. e.g. put someone else’s story into your blog.

Governance Model

Still have to have governance though. Study other successful projects, e.g. wikipedia. Key is a benevolent dictatorship with radical openness.

Risk

Risk aversion and fear is failure before even beginning.

Study the licenses and pro-actively license your content. e.g. GPL, Mozilla

Disagreements

Leading with questions to ask one-on-one why they

E-mail and IRC suck.

Best practice is to move to audio/video if the e-mail and IRC is not working.

Setting frame for discussion. Turn it from “Do you want a vitamin?” to “Do you want the orange or purple vitamin?” Another example would be to share only benefits of two choices.

Open Corporations

Use open paradigm. For example, Twitter uses volunteers to localize, so even though it doesn’t use an open platform, it uses an open model.

But propriety, locked down systems are in the process of dying. There are companies that are open software corporations e.g. Firefox, Redhat. What really makes you special is customization, service, etc.

Start internally. It doesn’t need to be open externally. It can open within the organization first.

Learn from Others

Study the successful open companies and organizations.

Model

Model for success, status quo and failure as a win, because you have learned what not to do again.

Think ahead and think aloud.

MozFest 2012: Notes from Responsive Design Session

Techniques & Tips

  • flexible grids
  • media queries that aren’t pixel dependent
  • media queries to selectively adapt the page
  • responsive images (max-width: 100%, can hide small (767px)/medium(1296px)/large (1440px))
  • can use modernizr to detect if touch device
  • Foundation has flex classes for embeds to resize YouTube videos, etc.
  • For iframes, can use padding: % of ratio of iframe/embed
  • Responsive iframes by NPR will do it for you as well
  • Source code order (for screen readers especially)

Download Foundation (basic responsive, reset files) – uses 12 columns

Thoughts

Coding on the fly is great if the space is setup to be a hack session type thing, but the way the room was set was very much just presentation style. I just feel like I’m not really learning much when someone is coding in front of me. Demo is totally fine, but just watching them enter text seems like a bit of a waste of time.

I know mozfest is open for everyone, but somehow I expected it to be more advanced. I don’t think this covered anything I didn’t already know, and I wasn’t a huge fan of the fact that it was based on an existing package.

Definitely a great session to have for those who don’t know anything about responsive design though.

FSOSS 2012: Accessible Applications

Attending FSOSS (Free Software and Open Source Symposium) 2012 this morning. One session in particular caught my eye since I’ve been looking into how to make our web services more accessible, but just writing about making anything we might offer students more accessible. So here are my notes:

Accessibility: Importance, Challenges, Technology, and Implementation

Chad Pilkey & Justin Robinson

A lot of people (10-20% of population) have a functional disability. Not just an ethical issues, but also a legal one.

Software student is working on is using Adobe Flex 4 with its own Accessibility Framework using API.

Need to plan ahead of time and can make it much more user friendly.

HTML5 ARIA

  • accessible rich internet applications
  • allows for dynamic content compatible with screen readers
  • assist HTML5 with flex-like accessibility features
  • useful to those who need it; invisible to those who don’t

Limitations

  • flex: uncooperative components, potential obsolescence e.g label components will not be read (have to use built-in labels)
  • HTML5: not yet standardized, may remain that way for the next 2 years

Combined both in order to make up some of the limitations.

Need to test!

Considerations

  • metadata
  • hot keys or way to skip past chunks of content
  • ability to change colours & fonts
  • larger buttons (don’t require very high precision)
  • a/v: transcripts, captions, volume control

There are definitely more considerations, but they didn’t list them all.

I didn’t include many notes on importance, types of disabilities, and screenreaders, etc., so more general information since I’m familiar with much of it and have blogged about it (which I’ll repost shortly).