Assignments

Principles and practices

  1. Plan and sketch a potential final project
  2. Read and sign and upload the student agreement.

Project Management

  1. Work trough a git tutorial.
  2. Build a personal site

1. p o t e n t i a l F I N A L P r o j e c t

sketch

CONCEPT IDEA

I started from my hobbies and interest, so I could find specific issues I can try and manage. That is how I get to two ideas: One from my concert madness from my teenage days and the other from all the trips I have made and my background in urbanism and art.
All the sketches are linked in this title and the "final project tab".


2. s t u d e n t A g r e e m e n t

The Fab Academy is responsible for:
  • Teaching principles and practices of digital fabrication
  • Arranging lectures, recitations, meetings, and events for the class
  • Evaluating and providing feedback on student work
  • Offering clear standards for completing assignments
  • Certifying and archiving student progress
  • Supervising class preparation
  • Reviewing prospective students, instructors, and labs
  • Providing central staff and infrastructure for students, instructors, and labs
  • Fund-raising for costs not covered by student tuition
  • Managing and reporting on the program's finances, results, and impacts
  • Publicizing the program
  • Promoting a respectful environment free of harassment and discrimination
  • Encourage a diverse, accessible, and equitable community

    I am a Fab Academy student, responsible for:
  • Attending class lectures and participating in reviews
  • Developing and documenting projects assigned to introduce and demonstrate skills
  • Allowing the Fab Academy to share my work (with attribution) in the class for purposes compatible with its mission
  • Honestly reporting on my work, and appropriately attributing the work of others (both human and machine)
  • Working safely
  • Leaving workspaces in the same (or better) condition than I found them
  • Participating in the upkeep of my lab
  • Ensuring that my tuition for local and central class costs is covered
  • Following locally applicable health and safety guidance
  • Recognizing limits on lab and staff time
  • Promoting a respectful environment free of harassment and discrimination

    Signed by committing this file in my repository,
    Ofelia Sevilla Valeriano

  • 3. G I T

    git workflow
    wHAT iT gIT, and GIT HUB?
    I couldn't understand it until I made a graphic for myself. With the help of the GIT GUIDE I got to the idea of GIT as a control for versions repository where you can save alone or in groups the same information. So, you can work in ypur personal workstation and make changes that will not upload to the "global" repository until you *tell* the staging area to do so and to save it as a version in all changes history.

    Download GIT BASH and opened it inside the general folder

    First I add my username and email address.
    git config --global user.email
    Then checked if there is alredy a SSH key
    cat ~/.ssh/id_rsa.pub
    As it wasn't I generate my SSH key
    ssh-keygen -t rsa -C "my mail"
    Then to saw the SSH key generated
    cat ~/.ssh/id_rsa.pub
    And to associate it with my repo html in git I copied the key with a command! ctrl c does not work!!!
    clip < ~/.ssh/id_rsa.pub>
    Then just log in to Fabcloud and add the copied key to GIT on web version
    First go to EDIT PROFILE and there you will find the SSH Key to upload with the email you register.
    (Don't forget to first clone your repo to you local workstation to start with! )
    git clone git@gitlab.fabcloud.org:academany/fabacademy/YOUR LINK .git


    It is alredy set up to work!

    The basic commands in git.

    git status to know the current situation of your work, if it something loadinng still to commit or if everything is alredy updated.
    git add . to add to the staging area EVERYTHING you have edited. I used this once I set up all the basics of my template and started to edit it
    git add public/name to add folders and htmls or specific images. First you have to be very careful and upload everything INDIVIDUAL by starting with PUBLIC/ because everything was in this folder. This is VERY important since i first saved everything outside this folder and I couldn't add anything.
    git commit -m "name" When you commit your changes you are telling the staging area what you did. For thet it is better to name every change you made for your versions record. Also it is important to write -m together and not separate I first struggle by not paying attention to spaces.
    git push finally submitting to the golbal repo versions.

    (Important to remember)
    Do not save archives with spaces. It will not recognize it. Use - or _ to separate words


    4. m y p e r s o n a l S I T E


    How????

    I have never done a webpage from the start. I have used Adobe portfolio that works as a portfolio itself but it does not work with coding. Is more familiar with editors that use Adobe suite because is like arrainging images and texts on Illustrator for example. So, to understand how this works I choose to code in html and to start I found a template from html5. Then to edit and visualize the coding I download brackets.


    First to understand how html coding works I visited this geeksforgeeks tutorial where I understood it has a basic structure as an essay with Header and body. Inside each you can add sections as titles, paragraphs and images.

    Also I used Chatgpt to help me improve and correct some coding. I didn't remember at the start that each decision always begins with a command and ends with the same command.


    Structure by Geekforgeeks.com



    Process

    As I started with a template I first explore some and found what I liked from each. With ONE that I like the most I explore the template folders and understood Assets is like the basic configuration of everything and has the shortcuts matrix I could edit. Here I edit and added some settings from other templates.
    Then I found where to change the colors for the entire template Saved the COLOR GRADE i wanted as a .jpg and copied the rgb color code:










    Some coding that helped me

      < p> < /p> To start a paragraph (it will have the style specified in the main assets)

      < h > < /h > followed by a number refers to the text style in the template. (in assets:css:main.css) < b> < /b>"Bold text.

      < div > < /div >Helps you organize sections in your code by grouping elements.

      Inside a section you can edit style="background-color: SELECT THE COLOR; padding: 10px;"> and manage the individual color for that text or also align the text. style="text-align: left;">

      < span > < /span > let you make individual decisions for any image, video or links you want to add in a paragraph. Example: < p > THIS TEXT < span style="color: red;">TEXT< /span> IS GOING TO BE RED.

      < div class="row" style="margin-top: 40px" > To stablished a margin between sections. (I used chat gpt to help me find this because I separate with sections and could not do it)