Portfolio

Arduino: CTC – Creative Technologies In The Classroom Education Project

Creative Technologies In The Classroom (CTC) is a part of the official Arduino Education program, CTC 101 is the flagship Arduino educational program for schools. Arduino CTC 101 is a modular STEAM program consisting of a toolbox with 26 projects and easy-to-assemble experiments, an online platform, and guided training/support for educators. The program, tailored for ages 13 to 17, has 5 modules and introduces students to the foundations of programming and basic coding, Arduino boards and digital signals, analog signals and serial communication, robotics, power systems and motors, wireless communication via Bluetooth and advanced sensors.

I worked with UX for Arduino CTC since it reached its 2nd iteration of development in 2014. During my UX work, my responsibilities included the design of the education web platform, features, testing, evaluation, education material, tracking/gamification features and more. I also worked on the PR, media production, documentation and the creation of guides and manuals. Thousands of instructional images and many video guides were created along with other education material over several years.

Sketch/Invision wireframe examples can be seen by clicking here.

Information about the Arduino CTC project can be found by clicking here.

Additional visual material can be viewed by clicking here.

CTC 101 Store page can be viewed by clicking here.

CTC_student_registration_wireframe

 
 
 
 
 


Arduino: ESLOV – IoT Invention Kit

ESLOV is a revolutionary plug-and-play IoT invention kit that aims at radically simplifying the way you build smart devices. ESLOV consists of intelligent modules that join together to create projects in minutes with no prior hardware or programming knowledge necessary. Just connect the modules using cables or mounting them on the back of our WiFi and motion hub. When done, plug the hub into your PC.

On Arduino’s project ESLOV, I worked mainly with UX and media production. I designed features of the web UI, wireframes, functions+flowcharts, researched user groups and established user scenarios. I also supervised the documentation / PR and Kickstarter media production.

Read about ESLOV Toolkit here – https://blog.arduino.cc/2016/09/28/eslov-is-the-amazing-new-iot-invention-kit-from-arduino

Eslov_ui_fix

 
 
 
 
 

Arduino: Education MOOC

The Arduino Massive Open Online Course (MOOC) is offered as a part of the official Arduino Education services. It is the communication and delivery infrastructure used for education content to reach educators, teachers, students and Arduino partners. The online platform features:

  • Real-time online user support system and live streaming classes (including video calls)
  • Training and support guides+videos for educators
  • Account sign-up/invite system for users/educators/teachers/students 
  • Administrative control and messaging system for educators/teachers to regulate classes
  • Full live tracking of user progress in courses
  • Includes tests, quizzes and unlocking criteria for advanced learning

I worked with UX for the Arduino MOOC system as a part of the Arduino Education development cycle and as an extended branch of Creative Technologies In The Classroom (CTC). During my UX work, my responsibilities included the education web platform, design, features, testing and evaluation.

Sketch/Invision wireframe examples can be seen by clicking here.

Information about the Arduino MOOC courses and education features can be found by clicking here.

Screen Shot 2018-11-14 at 01.19.54

Online test version: Wireframe redesign:

 

Arduino: EU PELARS Project

Practice-based Experiential Learning Analytics Research and Support (PELARS) is a a project about learning and making. It is a study about how people learn about science, technology and mathematics when they use their hands as well as their heads. Arduino participated in this EU-project that aims at helping teachers and learners understand what is happening when people do Science Technology Engineering and MATH (STEM). In collaboration with high schools, undergraduate engineering and masters courses in interaction design, the involved PELARS-partners evaluate common patterns across all these different environments. The results or work helps support teachers and learners, classrooms and STEM education overall. Arduino technology and applications that were developed partly for this PELARS EU-project, was later used in Arduino’s ESLOV – the IoT toolkit.

I was attached to this project as UX developer of Arduinos part in the PELARS project (toolkit + framework + IDE + UI). I contributed to development of the UI, user research, mapped detailed user scenarios and use cases, wireframes, documentation, flowcharts and prototypes.

For information about PELARS EU project, go here: http://www.pelars-project.eu/

pelarshq3

PELARS_UI_test_4-01_fix

pelarshq2

 

Arduino: Intel Edison Tutorials

The Intel® Edison module is a SoC (System on Chip) that includes an Intel® Atom™ 500MHz dual-core, dual-threaded CPU and an Intel® Quark™ 100MHz microcontroller. Its key features are integrated Wi-Fi, Bluetooth 4.0 LE, support for Yocto Linux, Python, Node.js and Wolfram. Intel® Edison Kit for Arduino provides the Arduino 1.0 pinout and standard connectors such as a micro USB connected to a UART, a USB OTG port that can be switched between a second micro USB device connector, a standard size USB host Type-A connector, a SD card holder, and a DC power jack.

I worked on the production of a series of Arduino/Intel Edison instruction tutorials. Check out a selection of them below!

 

Arduino: NIKE Marathon Light Installation

A light installation performed by Arduino Verkstad in Jakarta, 2013. 15200 LEDs in 3800 groups adding up to 1900 Chinese lanterns. 40 Arduino Mega boards, a specially design shield to handle communications and a lot of manual work. My duties on this project was working on-location, to assist, document and direct media production/post-production.

See some more photos of installation at: http://zacong.ninja/laternhack.html

jakarta_nike_3

jakarta_nike_4

 

Arduino: BBH Hackathon Jakarta

In 2013, BBH and Arduino collaborated in holding a week-long hackathon for young people in Jakarta, Indonesia. My role in the project was assisting production, documenting and directing media production/post-production on location.

Read some more information about the event here: http://adobomagazine.com/first-its-kind-urban-solution-hackathon-jakarta-partners-arduino-co-founder-david-cuartielles

 

Drawn To Life

Drawn To Life was my final bachelor degree thesis project in interaction design at Malmö University. It explores user interaction and dynamic narrative presentation in comics / manga on tablets and smartphones. It also emphasises alternative distribution techniques and digital rights management (DRM). The final thesis can be found at MUEP or in this link. Drawn To Life is an investigation into giving creators tools for added depth perception, interactivity and alternative visual narratives in comic, manga or graphic novels. It employs techniques based on sensor data input from a user / reader, like accelerometer-, gyroscope- or eye-tracking sensors. The project was developed to adapt the needs of several stakeholders: Nosebleed Studios, Serietecknarskolan among others, who participated in evaluating the technology.

Focus: Service Design, Digital Distribution, Digital Rights Management (DRM)  
Tech: Smartphones, Tablets, Android, HTML5, Processing, Sensors, Eye-tracking

 

Mitos

Mitos is a game design project exploring novel game control interfaces. The aim of the game is to evolve an organism, helping it reach sunlight. Symbolically, the game is controlled by transferring your “life-force” into the organism through breathing, essentially helping it stay alive. The idea is to give people the simplest form of control, which could aid people with reduced motor skills or disabilities. The prototype was positively evaluated by a representative from Massive Entertainment, it entered contest in the Nordic Game Indie Night 2012 and was used to showcase and promote interaction design studies at Malmö University, through their website.

Focus: Experimental Game Design, Sensors  
Tech: Arduino, Processing, Sensors

 

Unime

UNIME is a service design project developed together with Kentaro Ono and Yuka Fukuoka during my exchange studies at Tama Art University, Japan. The concept / prototype is a collaborative digital platform that creates an organised infra structure for supporting isolated individual manga creators within an university context. The service’s central function is to help students find partners, start projects and distribute work together. The system supports features like role organising, collaborative friend matching, project planning, industry infra structure support, professional mentoring, publishing and printing network, comic / manga kickstarters and crowdfunding integration.

Focus: Service Design, User Experience, Online Collaboration, Social Platform
Tech: HTML5

UNIME Presentation Posters

 

Kaiten Zushi

Kaiten Zushi is a service design analysis assignment of a successful local business venture resulting in a customer journey map (CJM). This CJM created by myself, Kentaro Ono and Yuka Fukuoka, hints at how this particular sushi venture’s success relies on circulating customers as efficiently as their sushi serving mechanical train.

Focus: User Journeys, Visualisation, Analysis
Tech: Sketch, Analog, Vector, Print

final_pres_drawn_to_live_2013-06-03_2

 

Geoexplorer

Geoexplorer is game prototype that emphasises novel game mechanics when discovering and exploring 3D environments within a MMORPG (Massively Multiplayer Online Roleplaying Game) context, using real-life user location and GPS data. When a player connects to the GeoExplorer system, their GPS location in the real world is calculated in correlation to another player in-game. This distance between players, determines the game-world size. So in order to explore the dynamic game world, it is in the interest of the players to connect with other players in geographical locations as far away as possible. This creates interesting game dynamics and player motivation challenging how we look at multiplayer games today. The prototype promotion video above, shows how the exterior game world dynamically changes due to player connections (friends) in real-world locations.The prototype video below, shows the an interior game representation, showing how the inside of an building lights up when a friend-player connects to the game system.

Focus: Game Design, Mobile Devices, GPS, MMORPG
Tech: Unity3D, Android, 3D Studio Max

 
 


Freenet

Freenet is an interaction design project that creates a viral information network solution for situations where a country would be in rebellion or communication infra structure is disabled (like in the case of the “Arab Spring”). If mobile networks or the internet are shut down, FreeNet would be able to make social networks and data communication continue functioning by using viral hubs (XBee® 802.15.4 wireless technology). These FreeNet viral hubs are portable, small and easy to hide. They replicate / distribute / update social media data, as long as people using them connect within kilometers from each other, sustaining communication infra structure.

Focus: Critical Design, User Experience, Social Media  
Tech: Arduino, XBee® 802.15.4, HTML5

freenet-2012-01-06-001

 

Terratime

Terratime is a physical prototype concept that is aimed at analysing, visualising and changing your sleep routines. Motion / light-sensors detect variables that show abstract behaviour patterns. If you sleep too long or too little, TerraTime will show you how much you you need to compensate to get proper rest and can effectively change clocks and time indicators in your living quarters through IoT connections. It will also manipulate lights and power settings based on behaviour data. The video below visualised the concept/design.

Focus: Critical Design, Concepts, IoT
Tech: Arduino, Sensors, Sensor Networks

 

Rang My Bell

Rang My Bell is an interaction design physical prototype made in one day. It connects a web-camera to your door eye-socket (sneak-view) and a sensor to your doorbell. When someone presses the doorbell, the web-camera records and still image of the person outside the door and sends it online to your DropBox together with an message. This allows you to see who is or has been outside your door trying to visit you, whether it is the postman or an unwanted visitor.

Focus: Interaction Design
Tech: Arduino, Sensors

 

Washingtime

Washingtime is a 1-day interaction design project that allows you to see if there are available times to physically book a washing machine in the basement of your building. Sensors are connected to the key-locks on the booking timetable in the basement, these record if locks are activated on the individual time slots. This data is then sent and stored online for everyone to see and it prevents a user from having to walk several floors down in order check the washing machine booking time-table, especially if you live more than 10 floors up without an elevator.

Focus: Interaction Design, Brainstorming
Tech: HTML5, Sensors, Sensor Networks

 

Studenthjälpen

Studenthjälpen is an online service that helps students find each other within an university campus context in order to coordinate studies and the limited campus space. Using a digital map, visual positioning system (with text functionality) and multi-screen bill-board, students can mark their location to other students and send them messages. The video above shows the initial lo-fi user tests and the video below shows the digital mid-fi prototype user tests.

Focus: Interaction Design, User Experience, User Tests
Tech: HTML5

 


It Hertz

It Hertz is a critical design project were we wanted to investigate awareness of noise pollution and hearing damage, by testing bypassers’ hearing threshold and accumlating statistics. Bypassers are exposed to a sound sinewave that starts at a low frequency and slowly continues upwards through the frequency range until reaching 30000hz. At any time the bypasser can silence the sound, when either the sound becomes too much or they cannot hear it anymore. ItHertz then stores the accumulated data and shows an intermediate value by making the device gradually shift glow between red / green / yellow (or any value inbetween like orange), equaling bad > normal > good hearing threshold. The device slowly shifts through these colors as the represented statistics data is altered in real-time as more bypassers try the process. The installation was a part of a public exhibition at Malmö University 2012.
Pictures courtesy of David Cuartielles (link)

Focus: Critical Design, Physical Prototyping, Sound Pollution
Tech: Arduino

ithertz3