User Profiles Q&A

Mozilla recently added a new tool to the Webmaker suite: user profiles. Although still in alpha mode, user profiles are automatically available to anyone who signs up for a Webmaker account. We chatted with front end architect Gavin Suntop to learn more about this new feature.
Webmaker | keyboardkat 2013-12-05 11-59-43
Q: Why did you create User Profiles?
A: This was a request from our mentor community. Before profiles existed, people could create projects with Thimble and Popcorn, but there was no way for them to easily show all their work in one place.

How do they work?
Once you’ve signed up for a Webmaker account, you automatically have a profile available at yourusername.makes.org. If you navigate to your profile and log in you can curate your Popcorn and Thimble makes. By default, everything is private but you can make anything public in edit mode.
Why did you decide to make the default mode private?
A lot of makers are students who are just learning to create things on the web and they’ve asked a way to have private drafts. We want people to be comfortable getting started and not worry about the world seeing something they don’t feel is ready.
Webmaker | smallbutmighty 2013-12-05 12-25-54Webmaker | smallbutmighty 2013-12-05 12-29-04
What else do the profiles offer?
Hackable tiles, which are basically “free areas” that you can do whatever you want with using HTML.
That sounds fun, but what’s the point?
We wanted a way for users to have a lot of expressive power with the profile, so the idea of a “free area” seemed natural. It’s kind of like a very small version of Thimble. You can simply enter text if you want — HTML isn’t necessary — but you can also add markup to get more fancy.
Really? How fancy?
You can paste in image URLs and they’ll show up when you save the tile. You can have different text sizes, and images and media elements. It’s about the level of complexity of a Tumblr post.
Webmaker | keyboardkat 2013-12-05 12-01-30
Not very many platforms on the web give you a free space. Why is it important?
I think part of our core as Mozilla is encouraging people to hack and learn about the web. Sites like Facebook and Twitter have really stripped away a lot of creativity. Things are becoming homogenous and we want to disrupt that by bringing back some of the “wild west” feeling of the early web. The important thing is to balance that with solid design and ease of use, which is definitely challenging.
Are you excited to see what people do with that free space?
Yes. We really want to see what users come up with. That’s why the UI is as minimal as possible — we just want to give people room to get creative.
Why did you include GIFs as part of the user profiles?
Again, I think it’s an experiment to see how creative we can make things. We want to give people more tools than just basic text editing and static imagery. I think there’s a real immediacy to GIFs — they have become a shorthand language on their own. It’s also a primordial web technology, a building block of sorts.

How is the mobile market reflected in the user profiles?
We’re taking a mobile-first approach with the profiles — that’s different from Webmaker’s other tools, which are primarily for desktop. This means the profiles are stripped down to the essentials; mobile makes you do that. This is based on a concept by Luke Wroblewski.
Mobile is another reason for the GIFs — we’re hoping to see more device cameras being used with Webmaker.
Why is it important for people to share their makes?
I think community is very important to learning. If people are just working in a vacuum, they won’t learn as much. We’re also very much trying to foster a community of makers and mentors. People need to see what others are creating to draw inspiration from their peers.
What’s the status of user profiles today?
They’re live as a public alpha. If you’ve signed up for a Webmaker account, just go to yourusername.makes.org and start hacking your profile. We’d really appreciate if people could fill out our feedback form.
What’s next?
Development is paused right now while we see what early adopters do with their profiles. In January, we’ll ramp back up and create a roadmap based on the feedback we get.
Webmaker | smallbutmighty 2013-12-05 12-07-42
Do you have a list of features you know you’re going to implement?
We definitely need to push the social aspect so people can follow other makers and interact with them. For example, we’d like people to be able to put tiles on other people’s profiles.
That will be anarchy! Won’t people destroy each other’s profiles?
Before we added security stuff, you could actually do that and it was really fun. We made communal pages of animated GIFs with everyone just hacking away at the same time. I’d love to see that social energy come back.
That sounds fun. What else is in store?
We’d love to allow people to list what they’d like to learn and what they’d like to teach others. Currently, we’re planning to use tags as a way to indicate interests and find people who share them.
What about simple things like contact info and location?
Well, currently that can be solved with the “free areas,” because you can use them to share whatever info you like.
Right. I see how that allows you to keep the design really light.
Exactly. We’re looking for UI that isn’t overpowering. Instead of adding a ton of features, we opted for a simple design that allows more space for creativity. This way, the profiles are also easy to learn to use.
Webmaker | quirk 2013-12-05 12-02-47
How can people get in touch with you and your team if they have feedback?
If people encounter bugs, then Bugzilla is the best way to log them. We’ve got a great guide to introduce people to Bugzilla. For general feedback, we’d like people to fill out this feedback form.
Thanks, Gavin. Before we go, tell me about the wonderful people on your team who helped with the User Profiles.
Cassie McDaniel worked with me on drafting the initial wireframes. Kate Hudson assisted with design and front end development. Dale Karp helped with front end dev. Chris DeCairos, Jon Buckley and Pomax worked to get the backend services up and running.

Get Involved:

 

1 response

  1. terrence wrote on :

    Thanks for your sharing, very helpful!