From:  Chris Mills <cmills@mozilla.com>
Date:  26 May 2015 17:50:58 Hong Kong Time
Newsgroup:  news.mozilla.org/mozilla.webmaker
Subject:  

Re: Web teaching day, University of Greenwich, UK. 22nd May 2015

NNTP-Posting-Host:  63.245.214.181

This looks very cool Francesco - you’ll have to let us know how it goes!

Chris Mills
  Senior tech writer || Mozilla
developer.mozilla.org || MDN
  cmills@mozilla.com || @chrisdavidmills



> On 26 May 2015, at 10:40, Francesco Iovine  wrote:
> 
> Hi Chris,
> 
> thanks for sharing this, I do think that education is a key aspect for the future of the Web and you're great in educating :)
> 
> On the same topic, I'm heading to the WebWeWant Festival in London (Southbank) this weekend:
> 
> http://webwewant.southbankcentre.co.uk/
> 
> If anyone goes or want to join, just give a shout.
> 
> Cheers,
> 
> Francesco
> 
> 
> On 26 May 2015 at 09:15, Chris Mills  wrote:
> Hi all,
> 
> 
> Last week I spoke at Web Teaching Day (https://webteachingday.wordpress.com/). This was a fairly small gathering at the University of Greenwich in London — perhaps 30-40 teachers and students interested in web education — providing a chance to share education ideas, talk about current problems and suggest solutions.
> 
> Since this is one of the areas I am passionate about, this was a really good opportunity for me to reconnect with the education community and share some of my perspective (and Mozilla's). And not only people from the UK — people had come to the event from Portugal and Denmark.
> 
> Chris Mills
>   Senior tech writer || Mozilla
> developer.mozilla.org || MDN
>   cmills@mozilla.com || @chrisdavidmills
> 
> PS: There are a lot of notes below, but I’d recommend a flick through, especially if you are interested in education techniques. There’s some good stuff down there.
> 
> 
> -------------------
> 
> My talk (Guerrilla education) went down very well, seemed to get a lot of positive retweets, a lot of people enjoyed my ideas about teaching outside FTE, and some of the new tools, etc. Mozilla Foundation have got coming up.
> 
> Slides at http://www.slideshare.net/chrisdavidmills/guerrilla-education
> 
> -------------------------
> 
> Interesting concepts
> 
> Discalclic - code version of dyslexic? Not heard of this before, but was chatting to Richard Eskins, the organizer, about the concept, and why it means not everyone can necessarily learn to code.
> 
> Adam Procter
> Games design curric
> github.com/adamprocter - pubic curric. games curriculum?
> code.org - interesting login system
> talk to the thimble devs about a better login system? How about something that allows a teacher to create a master password and then students can log in from that? To avoid needing everyone to create a separate login?
> 
> -------------------------
> 
> 
> Guy Routledge - How to teach the Web
> 
> Works for general assembly (GA) - look them up.
> A-Z CSS
> 
> teach process, not syntax
> show the end result first, then show the syntax that got you there
> teach the process of saving, switching programs, refreshing, etc.
> teach dev tools for the start. Use dev tools to teach the box model. dev tools can teach a lot
> 
> teaching CSS layout is hard
> instead of throwing up a mockup
> wireframe first
> remove the visual noise and focus purely on the layout
> instead of thinking about the whole design, break it down in to rows and columns
> 
> makes it easier to visualise the HTML structure too.
> 
> homework review on github
> communication on slack
> 
> -----------------------
> 
> Shelly Bartlett - Effective tools and process
> 
> lonely, teach "all" the Web.
> 
> Broadstairs based campus, teaching BA in graphic design, and BA in web design
> 
> at the start, 80% of student work was dreadful; this was probably the teacher's fault. How to improve teaching?
> 
> students intimidated by Web
> 
> 5 things to break down the intimidation
> 
> 1. webpagesthatsuck.com - a great resource for having fun with crappy websites. after looking at the list, they compile a list of bad things about those websites; the suck list
> 
> 2. whatfont tool. use this to give students an appreciation for typography. chengyinlu.com/whatfont.html. also teaches them some CSS, but in a visual way
> 
> 3. The assignment. Teach ideas, concepts, realising them. Look at a project development cycle. Don't do code until the end. Not HTML and CSS first.
> This way they will be invested in the idea to start with, so will want to learn the code to create it. <- BRILLIANT
> 
> 4. Screencast videos - sick of repeating theory to students, and then refer the students back to it.
> 
> 5. Mozilla Thimble! First mention ;-)
> Get rid of setup tasks. YUP, EXACTLY
> Although this does mean that they don't get the basics immediately. Need to make sure you cover it later.
> 
> After using these tips, 95% of her student's work is really good.
> 
> 
> The bad: Problems progressing into year 2. Her students seem to have forgotten everything!
> Ideas around this:
> * set a summer brief? they wouldn't do it
> * scrap assignment brief, write something better
> * get them going with codecademy?
> 
> Summer work placements can work well - give them paid work, incentive to work.
> 
> Hard to find placements? Could we get Mozilla to pay for some internship places?
> 
> National coding week - have a look at this! codexdld.com...
> 
> --------------------------
> 
> 
> Trine Falbe - copycatting; helping students become better interface designers
> 
> teaches UX, UCD, etc. in Denmark
> 
> there are 2 kinds of students
>         - students that get design, interested, experienced in it. they know what good design requires
>         - those that really don't
> 
> How can we help both groups? Copycatting.
> 
> Noone starts by being original.
> 
> Describe a website - looks like 90% of other websites, because people use the same frameworks, fashions of design, etc.
> 
> But it is ok to not be original
> 
> To apply copycatting - find examples of good design, then deconstruct them. How does this background get made, or dropshadow, or colour scheme.
> 
> Most can identify good design, but few can produce it. They might get low self esteem as a result. So copycat good design, and work it in to their design.
> 
> But modify the techniques - alter the colour scheme, etc.
> 
> Reproduction is easier than producing from scratch.
> 
> Show the students some current design trends, then get them to reproduce them.
> 
> pen and paper - sketching - is one of the best design tools, but one that many students forget about.
> 
> Copycatting benefits:
> 
> 1. Mould to work from
> 2. Speed
> 3. Fear of blank screen mitigated. Tell students to find 5 different influences to start from. And it doesn't have to be a website - colour of a chair, shape of a leaf, etc.
> 4. Copied elements evolve into new design ideas.
> 
> Copycatting also useful in other disciplines, e.g. video production. when working out atmosphere, colour correction, lighting, show scenes from popular TV programs or movies.
> 
> Challenges of copycatting
> 
> Applying it to software training like photoshop/illustrator can work well, but students can fall behind quickly if they meet something they don't know what to do. You need to have classroom assistants to go around and help the ones that have fallen behind.
> 
> Also take lots of breaks, so students can catch up and recouperate.
> 
> Often when they try to apply the copycatted techniques to their designs, it can look bad.
> 
> Youtube tutorials are good, but can sometimes be frustrating, for example if an instructor has a different photoshop plugin, or uses a different framework. Things can get confused, etc.
> 
> Speak to Lynda.com about getting accounts for students. Cheap bulk deals.
> 
> -------------------
> 
> David Watson - communication between teachers and students
> 
> need to choose correct mechanism - email is largely irrelevant to students. They use twitter, or snapchat, or ...
> 
> David's program is intensive; the students want return on investment, as they'd paid for it. They are a mix of recent graduates and professionals changing career. age range 24-54
> 
> Web design is in flux - it changes too fast and there is too much for an individual learner to efficiently take in. so they use learning teams, to share the learning.
> 
> Problems
> 
> Communication has become fragmented
> Students vary in levels of engagement. Some will use slack at the time and respond quickly, some won't even see it.
> 
> What channel characteristics do we need?
> 
> * sync/async - eg.g. twitter can be both
> * public/private - some students don't like communicating in a public space. Intranets can be good, although conunter to how the web industry tends to work. Being rsponsible for what you say in a public space is an important skill to learn.
> * archival/transient - you need to archive stuff. The same techniques, and the same questions, come up over and over again. it is affective to point them to previous answers, rather than answer the same questions again.
> * official or unofficial
> 
> Email
> 
> async
> private
> archival or transient
> official
> usage - in decline (esp. by younger students)
> 
> VLE (e.g. Moodle)
> 
> async
> private
> archival
> official
> usage - very reluctant
> 
> Forum
> 
> async/sync
> public/private
> archival/transient
> official
> usage - reluctant/dying
> 
> Google groups
> 
> async
> private
> archival
> official
> usage - reluctant
> 
> Twitter
> 
> sync/async
> public/private
> transient
> unofficial
> usage - popular, mostly
> 
> Facebook
> 
> sync/async
> public
> transient/archival
> unofficial
> usage - in decline
> 
> WhatsApp
> 
> sync
> private
> transient
> unofficial
> usage - secret!
> 
> SecondLife
> 
> Very popular in 2007
> Universities were building online campuses
> But interest waned
> this highlights the importance of not becoming platform dependant
> 
> the perfect channel is
> 
> sync and async
> public and private
> archival and transient
> official
> permanent/not subject to trend (not going to happen)
> 
> But what channels do students use?
> 
> synchronous, transient interactions are by far the most popular among students
> 
> this makes sense, as this is what humans naturally do - the original interaction experience
> 
> Is there any channel loyalty?
> 
> David asked his children
> 
> TeamSpeak, Skype, Telegram, FB (for organizing events)
> Text, Snapchat, Snapchat, Kik
> 
> 12 months later
> 
> No skype, moved to Telegram
> No Kik, moved to Whatsapp
> Not FB anymore
> 
> No channel loyalty really
> 
> groups of friends will choose the app where their friends are
> 
> 
> how important is e-mail?
> 
> only for receiving info from organizations
> no, it's too slow
> 
> Kids really want
> 
> convenience
> immediacy - real time, sync
> 
> Is there a way forward?
> 
> Slack is good. Ticks most boxes
> 
> archival
> cross platform
> immediate
> public/private
> quality of interactions - supportive, empathic, useful
> 
> students still use whatsapp as their back channel ;-)
> 
> 
> we still need to prepared for change - new channels will still come along
> We need to be agile
> Slack is better than what we did have, but it  still isn't the answer to all our problems.
> 
> music is less of a differentiator between generations these days
> communication channels more so!
> 
> -----------------
> 
> Christopher Murphy - startup ready
> 
> built a ticketing system with two students
> they built a prototype really quickly, then refined it throughout their second year
> they then went out and got £250,000 in funding
> and they've now passed the $1,000,000  in ticket sales
> 
> It has been a tough journey
> IP, trademarks, finance, burn rates, etc.
> 
> This taught me that
> 
> Business skills are critical
> We didn't know enough
> We need to fill this gap, as teachers
> 
> chris has bene teaching for 13 years. At the start students built static sites
> Passive, free, content supplied
> 
> Today it is a lot more complicated, SaaS, products
> Customer engagement, £££££, content required
> Very different outcomes
> 
> Different skills required
> 
> MFA - multi-disciplinary courses
> £650,000 raised
> BrewBot, Niice, Turf, GetInvited
> 
> BUT, the course is being shut down due to austerity
> 
> Essential skills
>         Pricing models
>         customer acquisition
>         Marketing
>         Brand strategy
>         pitching
> 
> 
> PLaces like Treehouse are starting to include soft skills
> But it is quite expensive
> Lynda.com also good but pricey
> 
> Paul Jarvis - the creative class. Teaches business skills to creatives. $300 to take the course
> 
> Loads of books to read!
> 
> Course requirements
>         Affordable (with free content)
>         Modular
>         EXtensible
> 
> How do we make it available?
> Curriculum addons
> 
> Tiny Books
> Core books (planets)
>         - brand story telling
>         - pricing
> smaller books (moons)
>         - what is a touchpoint?
>         -
> Tiny newsletters and topics (comets)
> 
> Web-based library of business content
> Accessible to all
> Priced aggressively so that students can afford it
> 
> Nesta has amazing worksheets
> 
> 
> 
> the craft of words - part one, Macrocopy
>                                    - part two, microcopy
> 
> 
> ------------------
> 
> Luke Whitehouse - Work in the web
> 
> running a three day intensive course called "Work in the web", through his company
> 
> Luke went to uni at Leeds
> working for MIXD, design agency in HArrogate
> MIXD does work for NHS, NRNC, school websites, and others
> 
> MIXD has ties with many unis and colleges
> does placements/interns
> workshops, lectures, conference talks
> 
> Work in the Web
>         For beginners, through to intermediate to build skills
>         CSS fundamentals, through to advanced layout stuff, etc.
>         Desining for the Web - a11y, color theory, vertical rhythm
>         Responsive web design - MQs, mobile first
>         Also cover advanced topics - workflows, tooling, preprocessors, version control, CMd line
>         How to get a job; #talkpay
> 
> Ideal candidates for attending work on the web
> Not necessarily the best 10
> We want people who will gain a lot form the course
> 
> Fill in an online form to apply to attend the course
> 
> WITW is hosted at the MIXD office, gives them a good social experience and an idea of what a design agency is like to work with
> 
> They collaborate with a local design meetup called "Hey!" - give them an idea of the open web community, the important of networking, etc.
> 
> Food and drink is provided - more social! More cowbell.
> 
> Sponsorships fund WITW
> They pay for the event to run
> 2 FTEs out of the office for 2 days to run WITW, plus time for presentations/PDFs, food costs, etc.
> It is hard to get buy in from sponsorships, as it is not immediately obvious what the benefits are to sponsors.
> 
> Why is WITW needed?
> 
> j.mp/boag-letter - open letter to university heads moaning about educators.
> "You see digtal as a luxury. For students it is a necessity."
> 
> Outdated skillsets
> Lacking the time
> 
> How can educators help?
> Spread the word
> 
> Future - WITW III, reach the rest of the UK, possibly do multiple locations
> 
> -----------------
> 
> Adam Procter - Hybrid designer
> 
> Adam works for a research university, so lot of theory and thinking
> 
> Hybrid designer - not designer/developer, but more of a multi-medium designer. Digital design or graphic design are becoming obsolete
> 
> The is probably the most exciting platform for communication design on the planet.
> 
> the web is in more places than just the screen, or the phone.
> 
> The challenge now is to create compelling comunication in a world where anyone who can design
> 
> I feel like responsive design has sucked the soul out of website design. Everything is boxes and grids. Where has all the creativity gone?
> 
> Why have today's web designers stopped dreaming?
> 
> To take full advantage of new technologies, and craft every usr's experience so that it's appropriate for the capabilities of the viewport they are using
> 
> Technology makes it happen. DEsign makes it relevant
> 
> Technology changes quickly, people's minds change slowly.
> 
> 
> Art direction
> Needed on the web
> 
> Seventeen coats of bullshit, Zeldman and Dan Mall
> 
> Without art direction, we are left with dry, sterile experiences that are easily forgotten
> 
> 
> Everything is digital
> 
> Communications tools don't get socially interesting until they get technologically boring.
> 
> His ideas were bold and magnificant; they could suck the air out of the room (about Steve Jobs)
> 
> Good design makes a product useful (Dieter Rams)
> 
> 
> What is a hybrid designer?
> 
> innovative communication
> design solutions for problems
> team work
> hybrid team methodologies, e.g Lean
> Dealing with big data/content
> IA
> context awareness
> user testing
> UX principles
> Prototyping
> Wireframing (html/css)
> meaning and hierarchy
> style/art direction
> front end coding
> UI consideration/UX
> Iteration
> Future focus
> 
> 
> A way forward?
> 
> Inputs - packs of content that outline a problem and provide core content/drivers
> 
> learning - team work, innovate, etc.
> 
> outcomes - posters, books, zines, apps, code, art, data design, events
> _______________________________________________
> dev-mdc mailing list
> dev-mdc@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-mdc
> MDN contributor guide: http://bit.ly/ContributorGuide
> Doc project Trello board: https://trello.com/b/HAhl54zz/status
>