Week 01 — Principles and Practices

This week marked the beginning of my Fab Academy journey. The focus was understanding the course structure, setting up the development environment, and creating the personal website that will document the entire learning process.

Week 1 establishes the mindset of documentation, project planning, and iterative development that will guide the final project.

Objectives of the Week

  • Understand the structure and methodology of Fab Academy
  • Sign and upload the student agreement
  • Build and customize a personal website
  • Learn basic Git workflow for version control
  • Document progress and learning process
  • Sketch an initial concept for the final project

Website Development

To build my Fab Academy documentation website, I used the Phantom template from HTML5 UP. This template provides a responsive and organized structure with predefined navigation menus, stylesheets, and layout components that can be adapted for documentation purposes. Using this template as a starting point, I customized the website to document my weekly assignments and final project during the Fab Academy.

To manage and publish the website, I used Git integrated in Visual Studio Code. Git allows version control, meaning that every modification to the website can be tracked and synchronized with the Fab Academy GitLab repository.

Cloning the Repository

At the beginning of the program, each student receives access to a personal repository hosted on the Fab Academy GitLab server. This repository contains the base structure of the website where all weekly assignments are documented.

The repository was cloned to my local computer, allowing me to edit the files locally before publishing them online.

Installed Git and configured Git Bash

Editing the Files

All files were edited using Visual Studio Code. Starting from the Phantom template structure, I created new HTML pages for each weekly assignment and modified the navigation menu to include links to the different sections of the website. I added text, images, and documentation content to each page while keeping the original layout provided by the template.

Images and media files are stored in the images folder and referenced in the HTML files using relative paths. This helps maintain an organized structure and ensures the resources load correctly once the website is published online.

Using Git in Visual Studio Code

Instead of using the terminal, I used the Git interface integrated in Visual Studio Code. When files are modified, Visual Studio Code automatically detects the changes and displays them in the Source Control panel.

The workflow used was the following:

  • Modify HTML files or images in the project folder
  • Open the Source Control panel in Visual Studio Code
  • Select the modified files and stage them (equivalent to git add)
  • Write a commit message describing the changes
  • Commit the changes
  • Push the commit to the Fab Academy GitLab repository

Once the changes are pushed, the website is automatically updated on the Fab Academy server and becomes publicly accessible online.

Continuous Documentation

This workflow will be repeated throughout the Fab Academy to continuously document each weekly assignment and update the personal website.

About Me Page

I created my personal profile page describing my background as an industrial designer, educator, and digital fabrication practitioner.

The page highlights:

  • my interest in the intersection of art, design, and technology
  • experience managing digital fabrication labs
  • focus on interdisciplinary collaboration and prototyping

This section helps contextualize my final project within my professional and creative trajectory.

Final Project — Initial Concept

During Week 1, I began exploring ideas for my final project.

Project idea:
Responsive Kinetic Flower

Concept goals:

  • merge art, design, and engineering
  • explore interaction through physical objects
  • create a responsive sculptural installation
  • investigate how objects can communicate and react to human presence

Reflections

This first week emphasized that Fab Academy is not only about making, but about thinking, documenting, and iterating.

Setting up the website and documenting processes establishes the foundation for the entire program, while early project exploration begins the transition from concept to prototype.

During this first week, artificial intelligence tools were also used to clarify concepts, troubleshoot technical issues, and accelerate problem-solving. AI assisted in understanding Git workflows, resolving coding challenges, and improving documentation clarity throughout the setup process.