Amruta Bhatt
@amruta712b
Dev Notes
#hello world my name is amruta https://www.sbs.com.au/theboat/
2do 2day - Amruta Bhatt
-get through the day -adjust to a new rented home -buy stuff for the house
Class learnings of the day
- We are creating boxes, because we are living in boxes. The Internet is such a vast and endless space; there's so much cool stuff out there of which we have no idea.
- the push to search and explore archived websites, new-age websites, websites that look simple but are much cooler to the tech-savvy websites wouldn't have happened otherwise if not for the assignment
- People have been creating uniquely crafted websites even before there was a need or competitive urge to do so. Why? How? probably out of sheer care for what they do. -while web surfing, whenever I came across an interesting interaction or feature or a gesture, it intrigued me how it would have happened, what it is called, and how I can do it. But usually this burst of enthusiasm or sudden urge to transform myself 180 degrees is ephemeral and dies soon. So I need to figure out a way to keep the curiosity ignited throughout the module to make the best of it!
- The reading " My Website is a Shifting House Next to a River of Knowledge. What Could Yours Be?" explains the world of the internet to a technologically challenged person like me about the web and the internet in a very "easy-to-understand" manner. Especially the play of metaphors helped my visualisation register the idea of the web efficiently in my visual library ( brain)
Class assignment
Loved the exercise of making something ugly, because the best way to learn is to explore by ourselves. This exercise gave me the freedom to experiment with the wackiest ideas I could think of that I wouldn't see on a website. The day was productive and challenging but in a positive manner. At the end of the day, I don't feel belittled for not knowing about HTML, but I feel excited to see what's in store for the upcoming days
DAY 3 of feeling surreal about coding
Class work insights Today's class felt less overwhelming than yesterday's. I felt today's class was a little more balanced in terms of coding and also creating a layout. Thus, there was a fair share of stepping out of my comfort zone and doing something that I like, which is making a layout and creating illustrations. The teaching method to keep up with what is being taught on the projector is helping to bring more clarity and confidence because it motivates me to believe that I am on the same page as rest of the class.
Properties that I came across today cursor flex flow order table tag background image and its position align-content and align-items
Class exercise - Story
** THE BIRD OF POPULAR SONG **
https://www.figma.com/design/VwqOuKS5SdTvUiZK3oGEbq/Untitled?node-id=1-4&t=4cEMyk996eMH0PWL-1
Day 4 - building blocks
Today felt like a milestone. Seeing my own designed website (wip) come to life was a huge confidence booster. Although still a long way to go with figuring out the rest of the relevant tags and logic of div and class to achieve what I want, the process has been so far enjoyable and not overwhelming. This type of individual project-based learning, which is also collaborative in a sense, has felt so much more productive. TBH, before the module began, my assumptions were that my inhibitions for making a website would grow stronger, just with the sound of HTML and CSS in the class description. But this class has surprised me so far every day.
Day 6 - Making grids
What worked -Firstly, the constant reassurance that it may seem hard now, but we will be able to figure out and get the hang of it -the practice of "coding along" whenever we learn something new -the game which helped bring clarity to the logic of the codes -the assignment through i am trying to stay a(float) :P ( the pun was intented)
What didn't work/ or seems not to work for now -ig its in my head, maybe, but "coding along" sessions as much as they are necessary, sometimes they also feel like a life jacket. What I mean by life jacket is, as soon as we are asked to do something of our own or to do something like today's exercise, I feel like that life jacket has been taken away, and now how am I going to get through this? Not that I am stressing about it, but before beginning any HTML file, initially, it feels overwhelming. -the initial youtube video that we had seen which had explained the idea of body, parapgraph and other tags had helped me visualise, it would be great if there were more tangible examples to explain section, div, main and article which we have learned recently, because i like to imagine these entities and assoicate them with real life objects to understand them better. -also, "github" "server" seems like words that are difficult to imagine what it would look like. For eg, the interface or the idea of Facebook and Instagram does not seem really difficult to understand because maybe I am able to relate them to real-life scenarios. When I had downloaded Discord, I was feeling so frazzled with the idea of servers, rooms, and channels. I still find it difficult to navigate, but slowly i dont feel taken aback with the interface. So similarly, for me github's interface seems slightly overwhelming.
Grid Personally, from Jen Simmon's video, I loved how she thought we could take inspiration from the De Stijl art movement into a grid. I am looking forward to trying unconventional layouts in grids, which, for once are designed for me and not an imaginary user.
notes of the day
-owning a website helps you not be at the mercy of other providers
- My work first needs to make sense to me
- Today's presentation and the websites that I have come across so far during this module have been an eye-opener. Tbh, I never knew websites like the ones I saw on Geocities or WebArchives could exist. For me, the definition of web design up until I saw these cool sites was the "conventional website," which we commonly see.
- The metaphor of a garden, to explain that websites can be there to track your growth, progress, and overall life documentation, has been helpful to explore today
Manifesto
As an introvert, I think I rely on art and other faceless mediums to express myself, and I think a website could be one of them. I want spaces to have multiple little windows into my life, revealing just enough to be curious. Till now, I have explored multiple mediums of art, different areas of design, and struggles of switching career fields ( from architecture to visual design), had my "owning my curly hair " journey, struggled with food allergies in a country like India, where the idea of food allergies is very alien, and found my ways to naviagte through a world overcrowded with extroverts. Thus, with this website, I would want to talk about topics I wish I had known before, along with the work that I have done revolving around the subjects of my interest.
As I am writing this manifesto at this very moment, I can visualise different layouts and ideas: a quiet corner, a rant space, space for an introvert, my allergy treatment journey, and a whole lot of paw prints ( just like digital footprints) for the good bois-doggos we don't appreciate enough
bonus question
I feel it is somewhat beneficial to have your platform to express yourself on the web, but I am not aware of how much it helps in acquiring work, such as jobs, commissions, or freelance projects. Perhaps I am still a novice in understanding the benefits, but if I invest my time and effort in creating something, I would naturally desire to reap the benefits and fruits of my labor. Because I may create a website now with a sudden urge of enthusiasm, but without any viewers, I doubt how motivated I will be later to maintain or update it. Although keeping aside the constraints of coding, the idea of creating a web space that is unconventional sounds cool as an approach; to be able to achieve something from the reference website would be a huge confidence booster. As far as the "Is there a larger point beyond this class? Do you see this helping you professionally? " question is concerned, I would say yes! Definitely, this class has opened new learning portals for me. Not sure atm how I'm going to incorporate it in my style or practice, but there's room for it definitely, because it has made me curious to learn/explore further
day 9
so far I have been able to create very basic layouts about what could my pages look like, i started with designing homepages because that would determine the overall look and feel of other connected pages. I am still unsure about what I want to place and what to skip, which of the texts will be links or icons or buttons. And maybe I have been looking at them for too long, but now i am unable to think what can i do further or where exactly should i place the contents. i am keen on taking further the building facade idea and the garden idea.
Issue link : https://github.com/amruta712b/web2025-amruta-site/issues
High Fidelity prototype
:root {
--color-primary: #FBD21A;
--color-secondary: #FFFFFF;
--color-secondary: #FDE98C;
--text-dark: #1f2937;
/* Adding typography too */
--text-small: 16px;
--text-normal: 28px;
--text-large: 32px;
--text-huge: 64px;
}
h1 {
font-size: var(--text-huge);
}
h2 {
font-size: var(--text-large);
}
p {
font-size: var(--text-normal);
}
.caption {
font-size: var(--text-small);
}
( A little confsued about what should I call as my primary colour, and secondary colour, will discuss tomorrow)
Day 11 : Eerie to Ease
Netlify URL: https://amruta-portfolio-website.netlify.app/
My goal for today was
- to make my home
- to add windows in my main content
- to make my about page
- to create "button" for new page
- to create a linking page for the button
goals for tomorrow
- finish my about page
- create my "works" page
- thinking about further layouts
Problems -Somehow, my Netlify is not displaying images while my local host is, thus I have added website screenshots -Arranging windows as per my liking of the positions on the main content page ( homepage), it felt like a lot of code
DAY 12- Progress so far
Goals for the day
- Start with the "Works" page
- Try to complete the code for "Works" page
- Finish "About" page
- Add footer
Goals for tomorrow
- finish "works" page
- Finish or at least begin the "illustrations page
- create a window tile for each category
Insights
I think I am enjoying the process so far. My idea was to make a fun website, and I hadn't expected the process to become enjoyable or fun as well. For now, I am thinking of writing code for the basic layouts and then getting into the "nit-picking" phase for the details, because I feel I am getting carried away in accomplishing the details, and then end up with no substantial progress.
Question
Does the footer door size look apt or should i increase it?
Netlify: https://amruta-portfolio-website.netlify.app/ Repo: https://github.com/amruta712b/amruta-portfolio-website
80 git commits
window changes amruta-portfolio-website | Aug 12, 2025 | |
homepage window change amruta-portfolio-website | Aug 12, 2025 | |
sidebar changes amruta-portfolio-website | Aug 12, 2025 | |
contact mailbox animation amruta-portfolio-website | Aug 12, 2025 | |
scroll down in about amruta-portfolio-website | Aug 12, 2025 | |
contact webp amruta-portfolio-website | Aug 12, 2025 | |
notes webp amruta-portfolio-website | Aug 12, 2025 | |
webp works images amruta-portfolio-website | Aug 12, 2025 | |
icons webp amruta-portfolio-website | Aug 12, 2025 | |
optimized images amruta-portfolio-website | Aug 12, 2025 | |
Merge remote-tracking branch 'origin/aman/illo-pages' amruta-portfolio-website | Aug 12, 2025 | |
WIP save amruta-portfolio-website | Aug 12, 2025 | |
changed footer amruta-portfolio-website | Aug 12, 2025 | |
contact me page amruta-portfolio-website | Aug 11, 2025 | |
footer changes in contact amruta-portfolio-website | Aug 11, 2025 | |
footer changes in contact page amruta-portfolio-website | Aug 11, 2025 | |
homepage window change amruta-portfolio-website | Aug 11, 2025 | |
scroll down fixed amruta-portfolio-website | Aug 11, 2025 | |
logo position fix amruta-portfolio-website | Aug 11, 2025 | |
favicon change amruta-portfolio-website | Aug 10, 2025 | |
edition in works page amruta-portfolio-website | Aug 10, 2025 | |
added text in works amruta-portfolio-website | Aug 10, 2025 | |
button side bar logo change amruta-portfolio-website | Aug 10, 2025 | |
made changes in sideba amruta-portfolio-website | Aug 10, 2025 | |
created illustration page amruta-portfolio-website | Aug 10, 2025 | |
new illustration page amruta-portfolio-website | Aug 10, 2025 | |
changes in grid amruta-portfolio-website | Aug 9, 2025 | |
added grids in works page amruta-portfolio-website | Aug 7, 2025 | |
animation amruta-portfolio-website | Aug 7, 2025 | |
scroll down amruta-portfolio-website | Aug 7, 2025 | |
added images amruta-portfolio-website | Aug 7, 2025 | |
illustrations page amruta-portfolio-website | Aug 7, 2025 | |
changes is padding about page amruta-portfolio-website | Aug 7, 2025 | |
works page amruta-portfolio-website | Aug 6, 2025 | |
added grid amruta-portfolio-website | Aug 5, 2025 | |
added notes images amruta-portfolio-website | Aug 5, 2025 | |
added notes amruta-portfolio-website | Aug 5, 2025 | |
added footer amruta-portfolio-website | Aug 5, 2025 | |
added notes amruta-portfolio-website | Aug 5, 2025 | |
made more image path chnages amruta-portfolio-website | Aug 5, 2025 | |
image path change amruta-portfolio-website | Aug 5, 2025 | |
change amruta-portfolio-website | Aug 4, 2025 | |
added button link amruta-portfolio-website | Aug 4, 2025 | |
made changes in about page amruta-portfolio-website | Aug 4, 2025 | |
made changes in buttom amruta-portfolio-website | Aug 4, 2025 | |
more changes in about amruta-portfolio-website | Aug 4, 2025 | |
changes in window amruta-portfolio-website | Aug 4, 2025 | |
added hover amruta-portfolio-website | Aug 4, 2025 | |
window changes amruta-portfolio-website | Aug 4, 2025 | |
adding windows amruta-portfolio-website | Aug 4, 2025 | |
added logo amruta-portfolio-website | Aug 4, 2025 | |
changed menu width amruta-portfolio-website | Aug 4, 2025 | |
changed menu amruta-portfolio-website | Aug 4, 2025 | |
aded menu amruta-portfolio-website | Aug 4, 2025 | |
added bg color amruta-portfolio-website | Aug 4, 2025 | |
made changes amruta-portfolio-website | Aug 4, 2025 | |
made more changes practice-project-tutorial | Aug 4, 2025 | |
added hamburger practice-project-tutorial | Aug 3, 2025 | |
new changes practice-project-tutorial | Aug 3, 2025 | |
footer header practice-project-tutorial | Aug 3, 2025 | |
added footer practice-project-tutorial | Aug 3, 2025 | |
added variables practice-project-tutorial | Aug 3, 2025 | |
changes practice-project-tutorial | Aug 3, 2025 | |
changed name practice-project-tutorial | Aug 3, 2025 | |
addded blogs practice-project-tutorial | Aug 3, 2025 | |
moved blkog practice-project-tutorial | Aug 3, 2025 | |
made blogs practice-project-tutorial | Aug 3, 2025 | |
changed index practice-project-tutorial | Aug 3, 2025 | |
added links practice-project-tutorial | Aug 3, 2025 | |
moved astro practice-project-tutorial | Aug 3, 2025 | |
about page practice-project-tutorial | Aug 3, 2025 | |
initial commit practice-project-tutorial | Aug 1, 2025 | |
made changes amruta-site | Aug 1, 2025 | |
need more changes amruta-site | Aug 1, 2025 | |
corrected mistake amruta-site | Aug 1, 2025 | |
adding 2 images now amruta-site | Aug 1, 2025 | |
added 2 images amruta-site | Aug 1, 2025 | |
made heading change amruta-site | Aug 1, 2025 | |
added ImageCard component amruta-site | Aug 1, 2025 | |
adds index.html amruta-grid | Jul 28, 2025 |