Principles, Practices and Project Management

Overview

Last updated: 22/03/2016

Objectives
1.Build a personal site describing you and your final project;
2.Plan and sketch a potential semester project and add it to your website. Upload it to the class archive;
3.Do a git tutorial;

Learning outcomes
1.Explore and use website development tools;
2.Formulate a final project proposal;
3.Identify version control protocols;

Have I...
Made a website and described how I did it?
Introduced myself?
Described and made a sketch of my final project?
Documented the steps for uploading files to the archive?
Pushed to the class archive?


Summary
During the week I mainly spent time in understanding what the FabAcademy was and getting used with a new environment. This page collects the work I did with Linux command line, GitLab versioning and web design with Bootstrap.
Final Project
I got into this course right away from my bachelor graduation. My thesis project was on shape changing displays and, as I was pretty excited about the project, I decided to continue in the same direction. I came up with the concept of “Wind Viz”, a physical visualisation tool for online data. Full description can be found here.
Linux commands
First of all I installed the Ubuntu distribution of Linux. Then, I opened the terminal for the first time in my life and tried to get along with simple commands. This is a basic personal library of commands I will be using again in the future (based on this tutorial):

$^C interrupts the current command
  $clear cleans the terminal
  $ –help explains the command
  $man show the manual for each command
  $cd ~ takes to home directory
  $cd .. takes to father directory
  $pwd shows in which directory you are
  $mkdir make a new folder
  $ls lists elements in a directory
  $ls –la same as ls but it also shows authentication and hidden folders
  $rm delete file
  $rm –rf deletes the folder and its content
  $nano creates a text file in the directory and opens a text editor
  $touch creates a file
  $cat prints on the terminal a textual file
  $tale prints on the terminal a textual file in each row
  $apt-get install it installs a package or software
  $apt-get remove it removes a package or software

When you do not have the permissions to execute commands in a folder, you can put the command sudo beforehand and type the password.
Version Control Project Management
Version control project management consists of using softwares (i.e.Git, Mercurial) that allow to work with multiple authors on large-scale projects. One should imagine those softwares to organise the work as trees, where the initial version of a given file is the trunk. From each trunk, new branches can be generated, which can later be merged again. Each one of these steps is recorded with the author name and a timestamp. That allows for total flexibility in recovering previous versions of a file.
In order to give it a go with a VCS I set up my own repo on GitHub. Git is an open-source software that enables to set up a distributed version control system, meaning that it gets cloned on a local directory and it is accessible also off the server. The manual says about Git:

	GIT - the stupid content tracker

"git" can mean anything, depending on your mood.

 - random three-letter combination that is pronounceable, and not
   actually used by any common UNIX command.  The fact that it is a
   mispronounciation of "get" may or may not be relevant.
 - stupid. contemptible and despicable. simple. Take your pick from the
   dictionary of slang.
 - "global information tracker": you're in a good mood, and it actually
   works for you. Angels sing, and a light suddenly fills the room.
 - "goddamn idiotic truckload of sh*t": when it breaks

GitLab
The website we use for documenting our work is actually hosted on a GitLab repository. Even though it has a web interface, we were strongly recommended using Linux terminal. It follows a basic personal library of commands to interact with the repository(based on this):

  $git config --global user.name "Your Name Comes Here"
  $git config --global user.email you@yourdomain.example.com for setting up authorship
  $git init begins the version control
  $git add applies the changes to the file
  $git commit confirms the changes
  $git checkout denies the changes
  $git diff shows the changes from previous file
  $git status gives a summary of the current situation
  $git man opens the help page for a command
  $git log tells you what others did change/upload in the directory

The steps to be executed in order to set-up a local repository with Git are nicely explained following this tutorial. In our case, we did not have to create a repository but we just had to get a development copy of the GitLab/fablabtoscana2016 on our desktop. In steps we did:
1.Create an account on GitLab;
2.Generate SSH keys for the project, as explained here;
3.Configure the user name if that has not been done yet;
4.Open the terminal and launch the following commands, as explained here;

cd directory
  $git clone git@git.fabacademy.org:fabacademy2016/fablabtoscana2016.git

It follows the list of commands/actions to be executed when willing to apply changes to one's repository. First physically modify/add/remove one or multiple files within the git folder on your desktop.

cd ...directory where changes are made
  $git status to check that the changes are actually recognised
  $git add .
  $git commit -m'whatever''
  $git pull origin master
  $git push origin master
  C^X if you get NANO text editor
  : q ENTER if you get VIM text editor
Web Design
As far as my website is concerned, I downloaded Bootstraap, which is a free to use template where html,css and javascript are served for a basic responsive webpage. After you download the folder, you can edit the index.html page and start to build your own website within the folder. The text editor I use is Atom, which I truly like because of its nice interface, toggle soft wrap option and completion. Since I am running Ubuntu 14.04 I used this tutorial to install Atom.


As for coding, I mainly looked for help at w3schools for tips and tricks. In particular, here are a couple of features that I implemented in my current website:
-Templates for bootstrap;
-Navigation Bar;
-Syntax highlighting;
The main difficulty I encountered with using Bootstraap is the little accessibility that you have in understanding the given code, which actually makes me a bit upset.
Conclusions
As a designer, most of my projects always pivot around a vision or a concept that need to be then executed. This time I tried to model the project briefing around skills that I want to acquire. As a result, I am not totally proud of my concept. Once again I learned how vital it is not to be scared by planning things out of my comfort zone. I know how to do 30% of the project briefing, the rest is either challenging or totally unknown to me. I will have to live with the uncertainty on whether I can actually execute my plan or not. I am quite fond of coding and I know the basics, even though I never really spent many hours on it. I have been realising more and more how vital programming could be for interaction designers who want to communicate with “neighbouring” worlds such as engineering and computer science. I appreciated getting acquainted with version-based sharing platforms such as GitLab. That also really introduced me to the open source way of working, where a significant amount of knowledge is stored and shared with a community.

Table of Content