co creation

It has been an interesting couple of days at school. I decided to get a project that I have been working on and off one up and running again. It is a RFID scanning system to assist with a 5km run, where people can scan when they start and when they finish. This has been talked about in my blog post, Challenging myself as well as building on building on existing message.

I managed to get the base version that I had been developing up and running again, after formatting the SD Card and reimaging it with the LCD drivers with this time with a 3.5inch screen attached to the RPi.
Through this I have been trying the GUI and the console version, I must say the console is helping as it is providing opportunity for rapid prototyping with its quick restart and low loading.

With the base system and running, it was time to start thinking of the next part, linking the data into a more suitable outcome, instead of being just on screen and in a text file, link it into a database service.

This is where I had a conversation with one of the students, what next. I showed him what the program was doing and how I had achieved some of the aspects. It was however something that needed to be developed better and have some more features. 15 minutes later he had a plan written on what the program could have done to it to support the ideas. Overnight he wrote a function that allows the creation of text documents to support start and finish tags, manage data during an outage or lack of connection.

This morning was integrating his function into the program and testing the ideas to see if they work. Many conversations have taken place and coding changed, is this a pair programmed piece of work now. Looking at what we are doing, could the standards that exist support this idea?

He has now taken a copy of the code home to continue development, as well as the dimensions to develop the next phase, putting it into action.

Looking at getting the data out to a mysql database so that we can add in different features, these will allow students to do creation of their own data next year using a mixture of google charts and bootstrap.


Note: since we are recording seconds, there is a function within mysql called SEC_TO_TIME() which will help with the conversion



There has been some great working on this project, It now no longer saves files to the raspberry pi, instead it is linked up with mysql.
Using google chart api has now allowed the data that is collected to be graphed based upon a PIN number.

Instead of using bootstrap, now use materialsecss, this is something different, while it is still responsive.

The beginnings of the website

What is the learning that has happened?

Version 1:
Development of rfid scanning system through the use of raspberry pi
Addition of LCD screen to the raspberry pi
Simple testing

Version 2:
Adding in database system to record data
To add mysql.connector to raspberry pi, sudo apt-get -y install python3-mysql.connector
Note: no phpmyadmin setup, for security, instead have to use mysql command line. (very important to note as it took me 2 hours to realise this as I have not worked on the project for 3 months)

Version 3:
Creation of website to show data through use of materialisecss and google charts api
This has now been complete, there was a bug that wouldn't allow the top record to be shown, this has now been fixed. Great setup and information is being recorded, this has been verified through a live test of the system on Monday 28th November through the EOTC Get Lost.

Version 4:
Login system to see profile

Version x:
Put out into real world and promote to a small group. Need to think about what this looks like and can be powered and developed.
- The idea of badges, for number of runs, beating personal best.
- The idea of developing a team, and running each week.
-

Also have to think about how to promote and develop promotional material.

digital media, standards

One thing I have been doing lately is starting to look at what is next for the digital media area. While it is not new and has been around for  number of years is the web open formats for media and images.

A number of years ago I watched a website that when you scrolled the image moved. This was part of a tourism New Zealand campaign. I have always wondered how to recreate this type of background and image without scaffold and expensive equipment.

Drones are the answer, with the quality cameras now available and simplicity being able to view what you are filming at the time. This allows the for the ideas to become real.

Here is the case study that started me down this track (took me three days to find it) https://www.smashingmagazine.com/2012/03/behind-scenes-tourism-new-zealand/

I managed to find a great site that uses this format, http://thenewcode.com/samples/polina.html, it has a video background that uses the .webm format. One thing that is talked about is that you do have to serve up both formats, a .webm format as well as a .mp4 format. That is due to some browsers not being able to use the format.

The webm format and project website https://www.webmproject.org/about/faq/

Also the webp format  https://developers.google.com/speed/webp/

So starting off with the idea of where I want to go. Scenario: We have a fantastic area near our school, a lot of history and an ever changing environment. Can we promote this?

I know, a jpg file

A screen shot of the website that uses this format for the background

To start to see what I have put together as an example stbedesdtg.com/video

I used some footage from one of our local parks to demonstrate the idea.

So, looking at the knowledge based standards, not just the skills based standards, what can we do with the students to really get them to show knowledge?

So why, I am looking at ideas to support the learning objectives around understanding of advanced concepts of digital media http://www.nzqa.govt.nz/nqfdocs/ncea-resource/achievements/2015/as91369.pdf

I have to look at the ideas of Standards and conventions refer to the technical specifications, guidelines and terminology appropriate to a media type.

So why look at the difference and ideas of jpg, png and webp, as well as .webm and .mp4. Considering the potential uses of these in a students work, as well as what they are developing web wise, it should be part of the course.

Also good for students to be able to discuss the positive and negative implications of adhering to digital media standards and conventions when developing digital media outcomes.

It should be noted that, these are my views and thinking. JPEG vs PNG vs GIF should be sufficient for this standard.
It should be to generalise the idea of standards. What they are, why they work/don’t work, and how it sucks to be a front end dev

Evidence for Digital Media Logo assessment

One thing that I keep thinking of is, what does evidence look like of logo development. Through one of the websites that was linked to earlier this week, I found a great tutorial that could help with showing advanced tools, plus I like the way that it was put together at the end.

First thing is first, sketching ideas, this is a great way to use a different space for the students to thinks creativity, something I would world allow them to wok where they wanted, to develop the idea, use the hallway, a breakout space, outside. Whee ever their creativity and imagination is best found. Use a visual diary, of piece of paper on card something that they can scribble over and take photos of or scan. 

I plan on getting my students to use vector based tools, opening then up to a produce outside of photoshop gives them opportunities to develop new learning using concrete information that they may already have.

Through the tutorial I like the way that the author has taken screen shots with brief pieces of information on how they created this. This type of method is shown in the level 3 digital media exemplars where students showed how they created their complex digital media. A tutorial that is published could allow next years students to learn how to develop and create their own ideas. It also helps the students to learn to use knowledge and skills from their other subject like english, to be able to communicate with and audience.

At the end of the tutorial I like the idea of a branding guideline sheet, it helps show the understanding of how the logo, colours, font can work to enhance the print outcome or website and it also informs where some of the unique ideas of the student come from through the exploration of the brand mark.

​ 

The tutorial that I have taken these images and idea from is available at ​http://design.tutsplus.com/articles/creating-a-coffee-house-logo-from-theory-to-vector-in-adobe-illustrator--vector-10709

complex digital media

One thing I am often asked about demonstrating understanding of digital media, is what is complex?

To me, it is around understanding someones else's code and having to implement it.

Case in point KAMAR web portal, the authentication is in the top of the page, however when you have a full banner, as most schools do, the authentication information, i.e the button to hit logout is in hidden the the bannar.
You need to be able to change it, you need to be able to read someone else's code and change it.

      <div id="wrap">  
           <div id="header">  
                <h1><h1>  
                {auth_head}  
           </div>  

now the {auth_head} which is a function needed is required to be moved to another location in the code.

The other example is being able to use a front-end framework.

What is a framework?
A framework is a standardized set of concepts, practices and criteria for dealing with a common type of problem, which can be used as a reference to help us approach and resolve new problems of a similar nature. 

In the world of web design, to give a more straightforward definition, a framework is defined as a package made up of a structure of files and folders of standardized code (HTML, CSS, JS documents etc.) which can be used to support the development of websites, as a basis to start building a site 

Most websites share a very similar (not to say identical) structure. The aim of frameworks is to provide a common structure so that developers don’t have to redo it from scratch and can reuse the code provided. In this way, frameworks allow us to cut out much of the work and save a lot of time.

bootstrap, angularJS are two frameworks that I use with students, why, because they need to be able to understand how to get these going and what can be done to support the website that you are creating. Be it responsive or adding in some extra control.

NCEA Digital Technologies, Digital Media looks like, simplified,

Level 1 basic, create a website using a text editor, add some css into it.

Level 2 advanced, start to use more complex css and HTML5 to design a webpage.

Level 3 complex,
Complex tools and techniques may include:
Web page design: HyperText Markup Language / Cascading Style Sheets (HTML/CSS), scripting (manipulating content), dynamic data handling, interaction between user and content, multiple device outputs

Some schools introduce php and mysql here, however to me that is level 2/3 information.

Without specific advice and guidance, this is a very hard area to plan and develop to work within your course. Looking at where I want my students to go, I want them to work down this pathway. The conversations I have with industry/polytechnic/Private Training Providers this seems to be the pathway that they would like students to go down. It means that students have understanding and demonstrate knowledge around this area.

The knowledge based standard is intended that students explore at least two complex digital media outcomes in order to discuss complex tools and techniques, and associated design elements, legal and ethical considerations used in relation to the requirements of the outcomes.

I am getting students to look at Network for Learning POND as a case study around this, as with the videos they can start to understand the design elements, the release notes provide some understanding on changes that have been developed and the whats coming section allows for students to see what is coming up. I hope soon that student access will be made available so students can develop a better understanding.

resources for print design, digital media, graphic novels

Resources are sometimes hard to find when teaching some concepts and knowledge in digital technologies or technology.

I have been planning with a fantastic teacher of english the last couple of days around "digitally creative through text". We have been planning a specialised learning module for our year 9 students. We have four hours a week for the semester. We are looking at developing a comic relating to the text that the students are studying, be it short story, poem or a novel. We are looking at developing skills around Digital Media using Print Design, under the Technology Level 4, Characteristics of Technology http://technology.tki.org.nz/Technology-in-the-NZC/What-does-learning-in-technology-look-like/Progression-Diagrams/Characteristics-of-Technology-Learning-Progression-Diagram

Now finding resources to support this, we have a great librarian who when given a concept has helped us find resources to support the teaching. On the shelve in the library office was a teacher guide on how to develop a graphic novel, with copies of the graphic novel.

The ministry has a great website called down the back of the chair. http://www.thechair.co.nz/, if you don't know your schools login, like many people, give them a ring on

The people at the other end of the phone would love to hear from you. 

The codes you are after are 711004(teacher guide) and 711002 (Graphic Novel)

Teacher guide

Graphic novel, not bad a $0.50c a copy!

The teacher guide has a fantastic section in it, in how the graphic novel is created.

This is a step-by-step run through of the process I used to draw the Arohanui graphic novel. Everything you see here was drawn on the computer using a programme called Photoshop. This panel was one of the first I chose to work on, mainly because it was relatively simple and a good one to work out my overall approach on. If I could get this panel looking good, it would give me confidence for my many pages to come. 

The author explains why he uses layers in Photoshop.

Flattening entails using the lasso tool in the too bar to section off different areas of the picture and then filling them with colours you have chosen.

What the final outcome looks like in the form of the graphic novel.

I like the ideas of the students going through and highlighting the skills and techniques that the author used to develop his outcome. In this unit I am looking at the Characteristics of Technology - Level 4.