CSS and CARP Design

At a Glance

Between the two html files, there are evident differences. This includes the background color, text font, size, and color, as well as some layout changes. Then to finish off the project, I added in a link at the top of the page, so that there could be a better comparison between the start and finish. The information that was processed or added into the page would be put into different layout files, so each section would be altered rather than individually bringing out the sections that are wanted to be changed. 

                                                                  Contrast

The website contrasts consist of the heading, subheading, and body paragraphs. The way contrast was used was by changing the color as well as font size, to lead the eye from the more important parts to the actual content. This allowed for the view of the heading, and a way to help intrigue a reader. The image of the dog also aids the process of bringing a reader's eye over the writing piece.

Alignment

Everything within different sections have a different alignment. For instance, the body stanzas or paragraphs are aligned to the left, like any writing portion would be. The image of the dog was aligned to the left to prevent distraction when reading, as well as provide more room for the writing section. The title was centered to act as a "roof" for the content, and as a funnel towards the content below it. 

Repetition

The aspects of repetition in this web project are mainly about the color scheme overall. The dogs colors are often used on the background and the text. For instance, the top html's color was determined with an eyedropper tool by selecting a lighter tan color off of it's fur. 

Proximity

When comparing the final product to the initial one, the proximity between everything changed by a noticeable amount. For instance, the spacing between the heading and stanzas, it grew significantly smaller as the image was moved out of the space between the two, so here is a more fluent or sensible way of reading the poem. 

Comments

Post a Comment

Popular posts from this blog

Junior Semester Reflection

Image
End of Semester Reflection for Junior Year Takeaways from the 5 Guarantees Technology e-Communication has five guarantees of success: technology, collaboration, communication, project management, and leadership. When it comes to the area of technology, I knew everything needed to get started with pattern work. This mainly meant that I could design the icons and symbols for each individual pattern as well as lay them out. I needed to do some learning when all of my layouts were completed, particularly on how to actually create a pattern our of what is on the screen. Even though the steps to make a seamless pattern appeared linear, I struggled with making it all work the way that I wanted it. Many of my patterns did not appear to be seamless, and some occasionally looked off-balance and uneven. Collaboration, Communication, and Leadership For each of the projects that have been done this semester, it has not been particularly easy to go above and beyond on these three gua...
Read more

Sophomore Graphic Design Reflection

Image
Semester 2 Project Spotlights Personal Logo Designs As the most recent project, the personal logos were one of the more difficult projects to sketch out and execute. I find this because I don't often create something centered around myself. That being said, drawing and writing out these ideas quickly ran my imagination dry, trying to figure out what else to add and how. However, I had eventually came up with 30+ designs, and stuck with the ones that either really it home, or spoke out in volumes in intricacy. When re-creating my originals in Illustrator, I realized how bland or maybe basic some of them had become in a digital format. This could have been from poor color palette or simply from a design choice in itself. However, I did manage to create three overall that meant something to me either in what it represents, or artistic in overall work. Event Advertising (Poster, Postcard, and Ticket) One of the more memorable projects of this year, I had been challenge...
Read more

Printing Processes and Techniques

Image
Relief Printing Relief printing was originally for hand pressing, rather than using an actual press. To do the process you would lay a piece of paper over a wood block, in which has an image with ink in cut sections. Beginning to make the block involves painting over it with a light black ink. After, you would lay a template down to draw the outline of the design desired. When carving the wood block itself, various white and black lines would be used to add or remove detail or additional texture to the image for when it transfers over to paper. After carving is completed, an ink roller goes over the block to prepare for pressing the paper. Linoleum cutting is similar to that of wood cutting, except removed material has a white finish, and anything that was left untouched remains black. Any tool that may remove the surface for either method will work for when you print, but blocks must be made backwards in terms of detailing to have a project that makes visual sense.  Intag...
Read more

My Personality Type

Image
My Myers-Briggs Personality Type After taking a test (Jung Typology Test) that had a variety of questions regarding my reactions to a series of events, I was given a four letter personality "combination." At that time I had no clue as to what it meant, I only saw percentages and words beside them. It stated that I was an INTP, or in other words, someone who spends time thinking, and focuses on the concepts of things, rather than hard evidence and facts. A couple of people who supposedly share this personality type would be Abraham Lincoln, as well as Albert Einstein.  How Well Does This Apply to Me? As I read through several websites explaining what an INTP is, I began to think more and more about it and found it as extremely accurate when compared to me. It also helped reveal several of my "mysteries" about why I act the way I do, as well as the way I think. Overall, it felt revealing and when going into a deeper thinking about some of the sections, it ...
Read more

Low-Poly Self Portrait

Image
 The Proper Picture Choosing a picture to work off of resorted to searching through my camera roll, eventually finding something that looked good enough to use. It didn't have any distortions or fuzz on the main parts (the face and hair), which was essential to the overall success of the project. Moving it to Photoshop, the size was reduced to an 8x8 in. square, and exported as a PNG or JPG. Illustrator required a new project to be made, containing two art-boards both the size of the edited photo, moving and duplicating it to both areas.  The Creation I decided to create a low-poly portrait because it has always been on my wishlist, never being able to get around to it until this chance had arisen. Going into it there had been thoughts revolving around how complicated it would seem, and constantly worrying about how it would turn out in the end. Working thorough it, the project became a whole lot simpler, as a grid was created and the pen tool was enabled to only s...
Read more

SPGD--Typography

Image
Decisions When going into the project, I was searching for ten quotes for either inspiration, or to do typography work on, and needed at least four to pertain to my everyday thoughts, or events/ activities. So I began searching for quotes pertaining to four things: music, scouting, chess, and life in general. As soon as these were written in my sketchbook, I went for fonts to fit the overall theme of each quote, fonts that represented words or the phrase overall. Some of the chosen fonts were universal in my project, as I used them in almost all of my drafts simply because of how they seemed to work with other words and its environment.  Development I started by creating four art boards, and placing my top four quotes on each one. I then brought up my list of each font that I had downloaded from DaFont.com, and scrolled through each one while my phrase or quote was selected so I could get an overall preview for each one. After deciding on specific fonts, I proceeded to ...
Read more

Careers That Interest Me

Career Cruising Through the website Career Cruising, I was able to take a matchmaker essentially based off of what I enjoyed or didn't necessarily like. After that to show some improved matching, I took an assessment over my set of skills that I believed I could do or not do so well. This gave me a grading from previous results on how much I matched up to them. The top 5 that were matched to me from the system are interior designer, graphic designer, animator, cartoonist, and artist. What are Each of these Careers? Let's begin with the the to one, interior designer, and their role is to design functional spaces indoors for homes and commercial buildings as well as making sure that they are comfortable. Graphic designers are to convey a company's or their own thoughts and ideas into a communicative form through things like logos, ads, and websites. Next, by definition, thins career makes or draws a series of images or drawing, then takes pictures of each one to c...
Read more

SPGD--First Semester Self-Exam

Image
Highlighted Graphic Design Projects Photoshop Challenge #1--"Nature Man" At the beginning of the year, we were re-introduced to Adobe Photoshop, and had to go through several tutorials to enhance our understanding and capabilities with the software. After these were finished, the class was tasked to use our abilities to create the "Nature Man." This project took about 8 days to complete, start to finish, with a few minor complications in between. These include masking problems, effects errors, and a few visual difficulties in the end. However, I learned how to alter the appearance of the image, without taking away the textures of the original image itself, as well as using some complex effects to complete the hair. Along the way however, I was given advice on how to go complete a function in a new manner to save time overall, most of which related back to masking, and how to properly go about it.  At this point, I was happy with my overall result, as I had ...
Read more

Printing Two of my Recent Projects

Image
 In the Beginning When the assignment came up in class, we were to print two of our projects that we were the most proud of. They were going to be prints of out personal top two picks from our unit in photoshop. The dimensions needed to be an 8in.x10in. in a new photoshop project. After this was finished, our picks needed to be altered to our liking, and transformed to be ale to fit both projects onto one sheet. Now they needed to be flipped horiOnce everything was aligned with even margins, the new project was printed and kept until they were required down the line. Watercoloring Once the projects were put onto paper, we used two pieces of cardstock, and began to create abstract watercolor paintings. When painting, I recalled which parts of the images would be heavily influenced by color. Areas of white become more susceptible to taking in color than colored areas. Colored areas would be emphasized when met with similar color. When finished, these would be left to dry b...
Read more

Words That Desciribe Me

What These Words Mean To Me: These words are those that I feel explain or define me the most, and what I got these from do an even better job at explaining myself. Almost all of these came from the Scout Law, in Boy Scouts, and I live by the twelve points in that law daily. However, I only chose a select few from it because I felt that they were better than the other points because it goes a bit deeper. For example, thoughtful is a word that not only has ten letters, but shows that I think of others constantly, but also enjoy to keep to myself. Silent is another that if you ask anyone that knows me well or has known me before, then they would agree and affirm it. And finally, scouter, it shows the roots of my main hobby and activity besides school as well as show what I base most aspects of my life upon. This also defines my dedication to the Boy Scouts of America, for I have started scouting in first grade, and I have achieved the rank of Eagle Scout at the age of thirteen, Augus...
Read more