Week 12. Interface and Application Programming#

  • Author: Kai Naito / Asako Okazaki (Fablab Kamakura)
  • Date created : 05/02/2019
  • Modified: 4/18/2020
  • Modified: 5/3/2021 Kae Nagano
  • Modified: 5/1/2022 Georg Tremmel

Time Table#

  • 5/4 (Wed) Global Session

    • During the Lecture, makes notes of what is interesting to you
    • Install Software/Apps until the Local Session.
  • 5/5 (Thu) 13:00 - 15:00 Local Session

    • Global Session Review
    • Review Sssignments
    • Share your Work Plan
  • 5/7 (Sat) 10:00-18:00 Free Work Time

    • Group Assignment
    • Individual Work
    • Please let us know before, if you need help/assistance


Assessment page

Group assignment

  • compare as many tool options as possible

Individual Assignments

  • write an application that interfaces a user with an input &/or output device that you made

Learning Outcomes

  • Interpret and implement design and programming protocols to create a Graphic User Interface (GUI).

Have you?

  • Linked to the group assignment page
  • Documented your process
  • Explained the UI that you made and how you did it
  • Outlined problems and how you fixed them
  • Included original code (or a screenshot of the app code if that’s not possible)
  • Included a ‘hero shot/video’ of your application running with your board


  • Do we have to interface to a board for the group assignment? Answer: No, but you need to learn how to create user interfaces.
  • Is it ok to use Command Line Interface (CLI)? Answer: Yes, as long as it’s GUI-like.

Advices from Instructors#


Make something that is part of your Final Project. It is tempting to try something new and shiny and exciting - but keep in mind that this should help your Final Project along.

This week will be eiter very challenging or very easy for you - depending on your programming experience. Even if you know programming very well, there are learning challenging, like picking up a new programming language or working with an app/framework that is new to you.

Group Assignments#

Try out and compare different development environments, frameworks, GUIs, and languages.


Set yourself a time-limit within which you try and compare. It can be exciting to try out as many as possible, but keep in mind that this is As a group you should try out at least one environment, framework, GUI, language for each student.

Try Serial Communication in:

  • Processing
  • Max
  • PD
  • TouchDesigner

Processing can make rudimentary GUIs, it’s language is based on Java. Max, PD and TouchDesigner are both of a Visual Programming Language. Full disclosure: I (Georg) started programming with Max - actually with HyperCard - but that’s another story! The advantage of Visual Programming Languages is, that the GUI is already part of the interface - no need to stuggle and create bespoke interfaces. If you are new and/or not so confident about programming, I suggest to used a Visual Programming Language.

If you wish, you can go down the full Application Development route with XCode, Swift/Objective-C and Interface Builder. Only do that, if you already know what you are doing. (XCode is mac-centric, I am sure something similar exists on other platforms.)

You can make a GUI in Python, but it’s not really what Python was designed for. Your experience - especially if you are new to programming - will not be great.

  • Individual Assignments

    • Connect it to the board you made at the week of Input devices or Output devices, and control it from some user interface or display the values graphically. Processing and Python are the standard.
      • 今週は、Input device、Output devicesの週に作った基板と繋いで、なんらかのユーザーインターフェイスから制御したり、値をグラフィカルに表示する。*Processing, Pythonが定番です。
  • アドバイス

    • It’s a bit of a challenge, but using a web browser is useful for IoT .
      • ちょっと敷居は高いですが、webブラウザを使う方法はIoTデバイスなどで有用です。
    • It would be a good idea to make this week relatively quick and move on with FinalProject.
      • この週は比較的手早く済ませてFinalProjectをすすめると良いと思います。
    • Let’s keep the FinalProject page updated!
      • FinalProjectのページも更新していきましょう!

参考 竹村さん公式ドキュメント


Class review#

Individual Assignment#

Group Assignments#

Announcements / notes#


Support documents#

Class video (recorded)#