This half day technical workshop is designed to give attendees a taste of what the Apps for Good course provides. We recommend anyone looking to deliver Apps for Good in their school or college use our taste workshops to explore interest in the programme.
Interactive Powerpoint_How to Master effective communication
Five Eras of Device Evolution Workshop
1. Workshop
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
2. Five eras of the evolution of devices
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
3. What is a smart phone?
?
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
4. Apps, their superpowers and
our problems
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
5. What’s an app?
A
B
C
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
6. Functions an app can use
Location services
Touch screen and
internal sensors
Purchase channel
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
10. Transit Video
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
11. Transit
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
12. Transit
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
13. Transit
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
14. The ‘VEX’ FACTOR
Familiar Frequent Specific
Irritant Expensive Mobile
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
15. Task 1
In your teams, describe
some problems you
know.
Unpredict
Familiar Frequent Specific Irritant Expensive
able
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
16. Task 2
Talk about the problems
and choose one.
Unpredict
Familiar Frequent Specific Irritant Expensive
able
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
17. The ‘VEX’ FACTOR
Familiar Frequent Specific
Irritant Expensive Mobile
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
18. Task 3
Act the problem out
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
19. How to plan your app
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
20. This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
21. This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
22. Task 4
Plan your solution
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
23. Balsamiq
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
24. Task 5
Create the name, logo and
description
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
25. Congratulations
and thank you!
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.
You cannot use these materials for commercial purposes.
Notes de l'éditeur
The first two slide are for educators only.The first two slides will not be visible to the audience when presenting. This is a half day (three hour) workshop designed to give students an idea of how to create a mobile app. It focuses on problem definition, solution design and some product build. Students will need computers to participate in this workshop and as an educator you will need a laptop/pc with internet connection connected to a projector.FOR THIS WORKSHOP TO RUN SMOOTHLY WE RECOMMEND YOU TEST BALSAMIQ AT LEAST THREE DAYS BEFORE YOUR SESSION.- Balsamiq account set up for main educator - email education@cdieurope.eu- Balsamiq accounts set up for each group – visithttp://bit.ly/SUGD9r These slide were created and share by www.appsforgood.org. Please contact us for more information at info@cdieurope.euThis work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.That means you can edit it for your own use, or share it, but if you share it you are obliged to credit Apps for Good.You cannot use these materials for commercial purposes.
Slide and time allocation for the presentation. For educators reference only.This PowerPoint is designed for a three-hour workshop. Some slides include extension activities, it is up to the educator to decide on whether there is enough time to fit them.This workshop can be extended to four hours by doing all extensions and giving students more time on each of the tasks. This Apps for Good taster workshop includes aspects of the Step 1(Problem Definition) and Step 3(Solution Design) of the Apps for Good, five-step model. Preparations/setupFor this presentation you will need Projector and laptop with PowerPoint loadedGroup the students in teams of three to fiveYouTube video loaded http://www.youtube.com/watch?v=8LPiZqQKYlkFive phone templates for each groupOne laptop per groupBalsamiqaccount set up for main educator - email education@cdieurope.euBalsamiqaccounts set up for each group - http://bit.ly/SUGD9rSome space for students to role-playVex factor hand outsA3 paper with marker pens for brainstorming and writing down answerEXTRA - Android phones with Transit app loaded http://bit.ly/Q0NXOl
Timing: 60 secondsScript short: Welcome studentsThree hour taster workshopApp, idea, design Covering a lot of work.Script long: “Welcome to the apps for the good taster workshop. This workshop is 3 hours and will give you a taster of what to expect if you were to do the full course. On this course we’ll cover, what an app is, what they can do, how to come up with an app idea and designing your app. We’ll be covering a lot of work in a short period of time so it’s important to stay focused.”Outcomes: Let students know what they will be doing for the next three hours, and explain how this is just a taster.
Timing: 30 secondsScriptshort:Technology is changing very quickly Script long: “A lot of you may not remember but in the 80s the first mobile phone was released: it was huge and is now nicknamed the brick phone. Not only was it a huge phone but also it also had terrible battery life. To use the phone you had to carry around the battery in a suitcase! Since then phones have got progressively, smaller, faster and more powerful. The current smart phones we have now are more like miniature computers in our pockets.”Extra info for educator to note: The evolution of devices, five eras:Brick (‘73-’88), Candy Bar (‘88-’98)Feat Phone (‘98-’08)Smartphone (’02)[Source, Fling, ’09, O’Reilly]Extension: If you have access to some old phones, please show the students as it can be quite interesting for students to handle them.
Timing: 30 secondsScript short:Mini computers, ask students if they’ve used a smartphone or own one. Transitions into next slide on apps.Script long: “Most of the phones that we have now are smart phones. How many of you have used a smart phone or own a smart phone? (chances are 90% or more of students hands will go up) So we’ve all pretty much come across them, smart phones can do everything a normal phone can do, except they have some extra key features that make them incredibly powerful. smartphones can access the internet for starters; some of them have powerful graphics; and -- of course -- they have apps that can be downloaded and installed at any time. This is one of things that makes them so useful, versatile and powerful.Extension Exercise: Ask students if they’ve used a smartphone, which one and how many.
Timing: 60 secondsScript short: Ask students what apps they’ve used, let them know you’ll be covering what apps are over the next few slides.Script long: “Over the next few slides we’ll be discussing what an app is and what makes it so powerful. Before we do that, what apps have you used?” (Students will probably name games such as angry birds, which is fine.) “Before we begin the practical I’m just going to give an overview of three important things:What are apps?The main technology they useAn example of an app that students have built from on this course”Extension exercise: Each time students name an app, try to name or get them to name the key problem that app is trying to solve or the role the app is taking. For example, Angry birds is trying entertain, Shazamhelps you find the name of a song.)
Timing: 60 secondsScript short:Apps get a job done, they follow steps just like recipes do.Script long: “A mobile app is a piece of software that runs on your phone to complete a specific task that the user has. Apps are a bit like recipes in the way that they have set steps to follow and a set outcome: follow the steps on a recipe and you’ll have a cake at the end of it. Follow the steps of an app and you can find a song you want, or find where you are -- or almost anything. As developers, its important to know what problem you are trying to solve and what steps need to be taken to get the desired outcome.”
Timing: 60 secondsScript short: smartphones have features such as location-based services, purchase channels and touch screens.Script long: “Smartphones can offer an application some cool functions including:Location-based services: See where you are, find what’s nearby (such as services, friends), get directionsPurchase channel: Order goods online, buy and download in-app content, access subscription-based services, send money to other people, use phone as discount voucherTouchscreen and internal sensors: Draw pictures, make sounds via touch; shake phone to perform a task; have the layout change when phone rotates from landscape to portrait; or brightness adjust according to light, or phone switch off after inactivity “Extension: You can ask students for examples of apps that use each of these features. Examples include: Location services – Google map, foursquare Touch screen/ internal sensors – Angry birds, Clear todo list, Purchase – iTunes, eBay If you haven’t already guessed, the superpowers I was referring to and the capabilities of mobile phones are one and the same. So lets take a quick look at what those functions are.
Timing: 30 secondsScript short:Notifications are another smartphone feature similar to text messages.Script long: “Notifications are similar to text messages, except they are pretty much free. They also allow your app to send messages to the user and to other users of the app.”Extension: You can ask students for examples of apps that use this feature.Notifications: Facebook, whatsappOutcomes: Let students know what they will be doing for the next hour and how this is just a taster.
Timing: 30 secondsScript short:Enjoy, capture and share music, photos and videosScript long: “Multimedia features on phones are getting better and better, features such as taking pictures, recording sound, video and of course playing and streaming them are all the norm”Extension: You can ask students for examples of apps that use this feature. Multimedia: YouTube, fix my street.Outcomes: Let students know what they will be doing for the next hour and how this is just a taster.
Timing: 30 secondsScript short:Mobile phones allow you to connect to other devices such as PCs, TVs and even cars.Script long: “Mobile phones are very powerful devices, probably the most powerful aspect of a mobile phone is its ability to connect to other devices and use their features or work with them. Did you know Sky has an app that allows you to connect to your Sky box and record a TV program? You can even connect your phone to your car and start the engine using your phone!”
Timing: 90 secondsScript short:Play the video and describe the difficulty parents and teachers have if they speak a different first language. Script long: “Here’s a problem video example that some students from a school in Bethnal Green in London made. Watch the video and see if you can guess what the problem is.” Play video“The video outlined the problems that can occur when teachers and parents cannot speak the same language. Students end up being the translator and might take advantage of that position.”Outcomes: Students understand what kind of problems they can come up with and see a real life example of what has come out of the Apps for Good course.Preparations/setup - load up and buffer this video: http://www.youtube.com/watch?v=8LPiZqQKYlk
Timing: 30 secondsScript short:Menu with key topics to be covered.Script long: “This is the actual solution that students came up with when solving their app. You can even download this app from Google Play app market https://play.google.com/store/apps/details?id=air.com.squaresight.transit&feature=search_result#?t=W251bGwsMSwyLDEsImFpci5jb20uc3F1YXJlc2lnaHQudHJhbnNpdCJdAs you can see from the screenshot students solved the problem by having a menu that contained key topics that teachers and parents wanted to ask and have answered. Let’s pretend that a teacher wanted to talk about the students behaviour, and pressed the behaviour button….”(Transition to next slide)
Timing: 30 secondsScript short: English to Bengali translation pageScript long “The behaviour screen would appear, this would show key statements a teacher may want to tell a parent about their student, when they press on the comment it plays the translated sound clip in Bengali for the parent to understand. After that they can press the English to Bengali button and the parents menu appears…”
Timing: 30 secondsScript short: Bengali to English translation pageScript long: “…on this menu the parent can ask the teacher questions about their student, the questions will then be translated into English and a sound clip will be played.
Timing: 10minsScript short:Problems we are looking to solve should have some of the above characteristics.Script long: “There are certain key characteristics that make a problem a problem, and worth solving with a mobile app, they are…Familiar: They effect either people you know (and can name) or yourself - you should be able to name three people that you know personally who have the problemFrequent: They happen often enough to justify a solution -- a problem that occurs once in a lifetime probably wont make a good mobile appSpecific: They have a clearly defined story you can tell – you should be able to tell a story that includes the problemIrritant: They often get on somebody’s nerves – if its not annoying it’s probably not even a problem. It may sound obvious but sometimes people try to create solutions to problems that don’t exist.Expensive: What you forfeit if you don’t have a solution is pretty high – this could be money, time, friends or other valuables.Mobile: They occur on-the-go in unpredictable times and places. If the problem occurs while you're by your PC, you may prefer to just find an online solution.”
Timing:10 minutesScript short:Get students to write down problems -- aim for six problems per group.Script long: “In your groups, brainstorm some problems you come across – but only focus on the problem, not the app solution.”Outcomes: Each group of students should have a list of problems that they come across. While doing this, they may come across difficulties such as not being able to think of any problems. It’s important to give them things to spark their thought-process, tell them to think about people they know and the problems they may come across. Get the students to think of what problems they come across while doing what they are passionate about. Also suggest they think of a day when everything “just goes wrong”, such as waking up late, not having any cereal for breakfast, and missing their bus. These are all problems that can be written down.Preparations/setup - A3 paper and pens for each group
Timing: 5minsScript short: Get students to pick one problem that they would like to solve most. They can start thinking about what would make a good mobile solution if it helps.Script long: “Now pick one problem that you would like to solve in your groups. You may want to think about the one that you are all passionate about solving or affects you the most personally -- as well as what might make a good app.”Outcomes: Students should pick the problem they want to solve, and inadvertently thought of the solution.NOTES TO EDUCATOR: In a full course, students would be given more time to think of the solution. On this particular slide you’ll find that students will naturally come up with a possible solution to the problem without you even setting it as a task. If they have not come up with a solution they will have more time later in the workshop.
Timing:10 minutesScript short:Get students to see how their problem fits into the VEX factorScript long: “See how many characteristics of the vex factor your problem has.”Note to educators: Students do not have to have every characteristic of the vex factor perfectly mapped out.
Timing: 15 minutesScript short:Role play the problemScript long: “Act out the problem with a role play. Don’t include the app in the role play, this is the problem only.” You may want to play the TRANSIT video again to show students that the problem video/role-play does not need to include the app.Extension: If time permits, suggest a few of the groups to role-play for the rest of the class.Outcomes: Gives the students a clear idea of what the problem is, who is involved and who is affected.
Timing: 60 secondsScript short: Wire-framing is a term used in the design industry to describe the visualization of the content of your app.Script long: ”Wireframes are the outline of what each screen of our app is going to display. Here’s the wireframe that the TRANSIT group created for their first screen. Most first screens have a menu, so think about whether your app will have one. Don’t forget some apps do not have a menu screen, such as Google maps.”Extra info for educator to note: Source http://www.webopedia.com/TERM/W/wireframe.htmlA typical wireframe includes:Key page elements and their location, such as header, footer, navigation, content objects, branding elementsGrouping of elements, such as side bars, navigation bars, content areasLabelling, page title, navigation links, headings to content objectsPlace holders, content text and images.
Timing: 60 secondsScript short: Wireframes are not supposed to be perfectScript long: “So here’s the second screen, where teachers can hit the English transplantation and have it translated into Bengali. As you may have noticed these wireframes contain no real detail, no images -- nothing that is too time consuming, mainly because they are supposed to be easily made and easily changed.”
Timing: 60 secondsScript short:Wireframe showing what user would see when translating from BengaliScript long: “The final wireframe displays what the user would see if they wanted something converted from Bengali to English. As you can see it’s quite different from the actual app. As things changed and they decided to have topics instead of a long scroll bar. This is all part of designing and wire framing.“
Timing: 15 minutesScript short: Wireframe a solution for you.Script long: “Now it’s your turn: take your problem, and try to wireframe a solution for you.”http://www.youtube.com/watch?v=jhknk61ds44&list=UU2j9jV0feQ0DS_0TxxEferg&index=9&feature=plcpOutcomes: Students produce basic wireframes that show how their app could take someone from problem to solution in a few screens.Extension: If time permits, suggest some of the groups share their wireframes with the class and talk through how a user would navigate through to solve their problem.The format for the students presenting should be:Tell the rest of the class what the problem is you are trying to solve.Talk the class through wireframes.
Timing: 15 minutesScript short: Balsamiq is a wire framing and prototyping tool that allows you to create wireframes online as well as link them together and even present your possible solution.Script long: “Log onto balsamiq using your log in and create your groups balsamiq. Make sure you watch the video tutorial first. Go to YouTube and search ‘AFG - Balsamiq crash course tutorial’ and then start building a real prototype.”http://www.youtube.com/watch?v=jhknk61ds44&list=UU2j9jV0feQ0DS_0TxxEferg&index=9&feature=plcpOutcomes: Students will start to see how their early design get closer to prototypes and could then in turn get closer to the final app.Extension 1: If time permits get groups to swap over and test each others prototypes in presentation mode.Make sure students are open to positive criticism and observe how others use their prototype.Students can then improve their app based on the feedback from the other groups’ user experience.It’s important that the groups giving user feedback are as clear as possible when they give criticism or compliments about the app.Good criticism is specific: “I was not sure if I would want to go through so many screens just to get to my solution.”“Perhaps more information about what I'm supposed to do on this page would be helpful.”“It’s not clear what I'm supposed to do on this screen -- perhaps fewer buttons would be better.”General criticism/feedback should be avoided “ I don’t like this.”“ This part is cool.”Outcomes: Although students might feel that the prototype is clear and makes sense, they may find others do not find their app as user friendly as they had hoped. Extension2: Get some or all of the groups to share their wireframes via a projector with the class and talk through how a user would navigate through to solve their problem using the balsamiq presentation mode.The format for the students presenting should follow this format:Tell the rest of the class what the problem is you are trying to solve.Talk the class through wireframes/prototypes via projector.Outcomes: Although students might feel that the prototype is clear and makes sense, they may find that others don’t not find their app as user friendly as they had hoped. Preparation: https://appsforgood.onconfluence.com/download/attachments/1573687/BalsamicEducatorGuide.pdf?version=1&modificationDate=1330014218234
Timing: 15 minutesScript short: Create the name, logo and description of your appScript long: “When you publish your app to an app store, you’ll need submit the name, logo, description and some screenshots of your apps, so users know what your app does. We have already created some wireframes/screenshots so now lets give our app a name, and create the description and logo.”Note to educators: This is a link http://bit.ly/Q0NXOlto the transit app on Google Play. Alternatively you can search “Transit Bengali” on Google Play to find and use it as an example.Extension: Groups can advise each other on logo design and whether the description is accurate enough.