This was another week focused on coding which turned out to be a delightful break from worrying about the unpredictable, economically uncertain future! For some reason, coding/designing is not an exhausting activity to do….but other things are? Why is this? Is this because coding/designing was already a screen-based activity? Anyways, the goal for this week was to get a decent website up for the disposal supply chain content. Second goal was to continue coding a website for the project itself.
Made progress on the: a.) disposal supply chain website, b.) flush out project website
a.) Disposal supply chain website
Kept designing the pages. The design was based on my original UX sketches. The content had already been written since February, which now feels like lifetimes ago.
Played around with svgs based on the udemy tutorial I’ve been watching.
a.) Codepen example of a svg animation test: here
b.) Another codepen example based on the tutorials (this one has more animation properties): here
b.) Website for project itself.
First did a rough design of the website. I decided to just make it a long scrolling website so people don’t have to click in and out too much. I felt much better after making this website just because I have a couple different pieces to this thesis. It really helps to house it somewhere in an organized way.
References:
- https://codepen.io/musically_ut/pen/zGOWBj
- svg format: https://jakearchibald.github.io/svgomg/
- svg tutorial: https://www.udemy.com/course/learn-svg-animation/ (so helpful!!! and udemy seems to have more sales lately)
- https://css-tricks.com/animating-svg-css/
Reference for are.na api plugin – for bibliography:
Reference for scss:
- https://stackoverflow.com/questions/19215517/attaching-a-sass-scss-to-html-docs
- https://stackoverflow.com/questions/51748991/external-scss-style-file-link-to-html
Reference for family tree using d3js:
- https://www.youtube.com/watch?v=1DUv_OS59Uc
- https://bl.ocks.org/mell0kat/5cb91a2048384560dfa8f041fd9a0295
- https://stackoverflow.com/questions/31245751/how-do-you-create-a-family-tree-in-d3-js
References (general):
E-Cycle: The Making & Discarding of Electronics 