So, I am back on working on the Mother's Day campaign for the lovebomb. I originally didn't want to work on this project because I felt that the project had too little learning involved and that we were essentially starting the user off in a sandboxed environment. We made some changes and I think that now it might be an acceptable low hanging fruit way to get started with playing around with HTML. Here's the low down:
CONCEPT
The concept is to create a tool for individual and collaborative letter sharing and storytelling**. The project is entirely web-based, in which participants remix templates** to express their love and sentiments for mothers and friends, in turn** learning some very basic HTML and CSS in the process.
**
**
**
WHAT IS IT?
- A method of building webpages from templates
- A narrative experience
- A publishing platform combined with broadcasting capabilities
- A learning tool- like bumper bowling for making simple webpagesWHY?
- Provide an approachable, fun on-ramp into our learning offerings
- Teach a little bit of code, without being too intimidating for a n00b3) Grow our base of supporters4) Create a unique method of narrative discourse **
**
PRECEDENTS
Lovebomb.me - obviously this is the first iteration of the tool.
What's working: emotional design, people immediately "got it", Fun templates
What's not: not enough guiding, you need to enter the tool with a certain comfort level with code.
Webpage Maker-** this was actually a pre-cursor to the lovebomb. The idea behind this was to provide a stepping stone for users who excelled in Remixing webpages to move closer to more concrete webmaking.
_What's working: _Simple design, templates, split screen view
_What's not: _No instructional overlay or any hints in the templates html/ css to guide users
**
**
E-card sites: Jib Jab, Blue Mountain cards, etc.
What's working: Some level of remixing, personalization and sharing
_What's not: _Not truly collaborative, and not digging into how the web page was made.
**
**
**
**
**
**
**
2 panel editors: jsbin, jsfiddle htmlpad etc.
What's working: super clean design, easy to see what you write vs. what's goin on the web
What's not: no specific projects that are coming out of it or element of learning**
**
**
**
DESIGN QUESTIONS
- What kind of learning experience is a user gaining by being subtly being introduced to writing code this way?
- How is the tool given new meaning by layering on Mother's Day content?
- How can this experience feel authentic while being embedded in an engagement initiative?
- What approach is required for on-boarding a non-coder into engaging with the underpinnings of the web?**
**
AUDIENCE
This is a tool for non- coders. People who came to the site either through Join Mozilla or other engagement channels. I am designing this tool in such a way that it can be used by adults or youth. Unlike Hackasaurus tools, youth are not the primary target.
MOCK UPS
**
**
I haven't picked up from where I last left off on the tool mockups, but I did sketch a few ideas for templates:
**
**
A super simple, sweet card. Serif/ handwritten fonta little silly
customizable (x= area to insert cute image of mom)I haz the best mom (photo takes up background) a la I haz cheezburger**
**
The timeline on this is super tight- so I will post as much as I can while I'm thinking through and sprinting.**
**