Category: Leon Eckert

Taylah’s First Website Blog Reflection

http://imanas.shanghai.nyu.edu/~tlb394/website-1/

I had so much fun with the HTML and CSS Website Creation. This was my first time ever using code to create my own site. Admittedly it was difficult at first because I had to miss the basics classes due to a Student Government trip to Abu Dhabi. However, Professor Eckert was kind enough to assist me by giving me a crash course the day before I left so I was able to complete the first HTML component. 

During the recitation in which we created the CSS Portfolio I was a little stressed because I wasn’t following everything 100%. However, I relooked at the slides and did some additional research and realized that a lot of my errors were simple punctuation error marks. 

The Process

I wanted to keep my website relatively simple but effective. I really do like websites that engage you with a lot of animations and colors but on this instance I wished for a more professional look. 

My favorite color is blue and I decided to create a background in a light blue with text in a dark blue. I also made my text centered to distinguish it from the rest of the writing. I kept the text in Helvetica font and quite large so it was readable by any demographic. I also placed borders around the headings to add dimension to the website. 

I integrated a couple of photos in to my website as well. I really like the effects that borders have and so I utilized a “double border” (including the use of padding) n order to create an effect in which I got to have two different colors overlay to create my border. The yellow served as a pop of color to take away from the blue. I also added a full page border to create a sense that all the information was enclosed in a simple, scroll down page without the need to click for additional links. 

I also linked my social media handles at the bottom on the page for further reference to anyone who might be interested in exploring more of my professional or traveling side that wasn’t showcased on the website. This was a relatively simple process to link and one that I really enjoyed. 

I wanted to add an animation element to my website and so I researched how to make text move across the screen. Therefore, I utilized the “Marquee” tag to create a moving banner across the top of my website. I think by adding this effect it gave my website a little more character. 

I did run into a couple of problems. The first was my inability to adjust the height and width to an appropriate dimension to see the image clearly. I played around with the heights and widths but couldn’t get the images to refrain from looking slightly off. The images look proportionate when the webpage is condensed but in full screen they look slightly distorted. Though, I guess you could see it as a positive and as a purposefully selected stylistic element (kidding of course).  The Second was playing around with adding images into the background for a gradient effect but I couldn’t quite get the code to work properly so I settled for a simple, classy design. 

Reflection

I was honestly really proud of my website. Although its not perfect and may not be anything special it represents the beginning of my communications lab journey. Having no previous experience of coding, I am really content with my ability to produce something that I am proud of in such a short amount of time. I will definitely be using it as the building block for the next projects and I would love to revisit it at a later date and spruce it up even more. 

Project: Fix the Project – HTML portfolio + CSS

Documented by Jiannan Shi

Webpage link:  http://imanas.shanghai.nyu.edu/~js9686/week_1/index.html

Date: Feb. 26, 2019

Description:

Problems I encountered:

1. navigation bar: I want to make a horizontal bar, and center it. But what I see is either horizontal but always on the left or they cannot be horizontal. The way I did the navigation bar was to change the way of displaying the <ul>list. To solve the “center” problem, I figured out that I need to set “display:inline-block;” in the CSS ul{} section. (reference: link).  To solve the problem that the purple bar cannot fit into the whole green line, I set margin:0; and padding:0; in the ul{} section. Final work:
2. the wrong position of the picture.No matter how I change the “text-align: center” of the title “a photo that I like,” or try to make the picture centered, I failed. Solution: I added another <div> dedicated for the title. And it finally looks like this:

http//imanas.shanghai.nyu.edu/~tsw298/week2/css-float-and-flex/index.html

I really enjoyed this article because it helped me deconstruct the many ways in which a comic is a very unique mediums which can convey ideas which other mediums cannot. Many of these things I had previously known subconsciously, however this comic made me realize many of the processes which my brain does without me even thinking about it. The medium of the comic is very interesting because it does not really need to conform to rules — while a painting, film, or text may be abstract, they cannot be nearly as abstract as a comic. The comic art form allows for an incredible amount of artist expression. One of the things I love most about this art form is how easy it is to break the fourth wall, in other words to both directly and indirectly address the audience. One of the most interesting concepts in this reading as well was the concept of time in comics. This is such a crucial part of reading comics but in my time reading comics I had never consciously realized the significance of the way that comic artists convey the passage of time. The explanations of very small details in the comic were very interesting too, for example when he showed the evolution of faces from realistic to the “stick-man” that we all know and love. It was very interesting to me that I could not look at the basic shape without seeing a face. I also really liked the part where it was the drawing of the painting of the pipe and he used that metaphor to explain that nothing is really what they are depictions of. This reading has give me many ideas for the upcoming comic project and now I am very excited to get to work on it.

Partnered with Laila 

Overarching Theme: Competing perspectives that there is a trade off between the digital world and the natural environment. 

Realization: That the two can actually harmoniously coexist when balance is examined and realized it can be implemented into ones life. 

Our interactive webcomic shares the story of a girl born and raised in the city who feels lost in the rapidly expanding digital world attributed to her position as a social media influencer. Where her daily life is to look through the lens of a screen to present a utopian society. Whilst watching “Planet Earth”, she has the sudden realization that she isn’t really “living” in the real world. On a quest to soul search, achieve self fulfillment, and reconnect with the natural world, she decides to disconnect from any form of social media, travel and see some of the world’s most beautiful natural places. Through our website, the reader will be able to navigate through panels showing her journey and interact with the website, making some choices for the character that will progress the story line. At the end, she realizes that she cannot take nature for granted and she cannot always be dependent on technology, she learns that these two things can actually coexist within her day to day life.

The places we are considering for inclusion in our interactive comic include:

1. Grand Canyon
2. Amazon Rainforest
3. Great Barrier Reef
4. Morocco Merzouga
5. Mt Everest