Futuristic Type Further Detailed

My idea of creating an iconic, aztec-rune styled endangered species is a go! I will be creating it on Illustrator, Photoshop, sketching my ideas and then transferring them digitally. I have an entire list on endangered species both in our country along with some that are outside of our country (due to letter specifics). The idea given to me to even further this futuristic development is to bring awareness of these animals- including the ratio that they have currently as well as what it could be like without these animals based on the hours that pass equate to about 10 years or so. 2 hours equates to 20 years, and this could equal an animal not existing anymore.

The other thing is that it could be a t shirt, that is connected electronically to create an emphasis on extinction. The animal that is about to die out would just fade away and disappear on the shirt itself, leaving the other runes left to stay alive until it is their turn to die out. Both information as well as my process of the shirt and what would happen work well. I feel like making a video might be a good idea. Combining both infographic as well as possible video versions created with something maybe not After Effects related but Windows Movie Maker could help. Otherwise, the idea sounds solid and I seem to be on the right path!

Bibliography Lesson 4

Today we learned more about incorporating fonts into our code if we were to have fonts from outside sources that needed copyright liscences.

We used the same bibliography, but found typefaces that matched the font we used beforehand- in this case being Georgia. The font that I originally chose for the first one was Tangerine.

I felt that Tangerine really worked with Georgia because of its fine lines and thin cursive. 

The second font I chose was called Bilbo(regular). 

While still being a script font, I felt that bilbo worked well with Georgia also because of its script handwriting, along with that it was a little bolder and expressive compared to the refined and elegant Tangerine font.

The final one that I decided to choose that was different and strayed away from script was called Alegreya regular, and Alegreya italic.

I made the italics be for the second headers, while Alegreya regular as the main Bibliography header 1.

For this one I chose to make the font smaller in size, because it worked a lot better than having it be larger than life versus the small text size of the body.

Space Jam Finale

Well, it didn't go as planned but the website finale is here. A lot of the problems that myself and Jamie ran into were the fact that we were both working with different laptops with different widths and heights, comparing to the computer lab's long screen. On my laptop for example, everything aligned perfectly centered. When it turned over to the lab computer, the arrangement of our timed parallax scrolling got all screwy.

Working on it at home I managed to be able to center things and change the colors accordingly but it still didn't end up working no matter how many times I moved the specific area down and aligned everything. Either way, Webydo was a good thing to make but at the same time super frustrating all the same.

 

These are taken from the computer lab's screen. I will take screen shots of them on my computer to show comparison.

Lesson 3: Bibliography

These two above are from the tutorial of making Bibliographies with CSS coding. 

These two below are what I changed. I made the headers in Tahoma while the body was in Verdana. I felt that this contrast worked well.

Week 6A Overview

Tuesday we dove back into using Fontographer. It actually isn't really that hard to use... it just is a little time consuming is all. I have had a small problem with it being the spacing between certain letters, but I believe that may be because of the fact that maybe the kerning is still an issue and I can't recall how to really go about it- so maybe once I figure that out it will be fine. Otherwise I can always just manually move things around to fit what they need to look like.

Before our actual experimental type, we are being given a mini assignment for a band. Choosing a band from the South to Southwest site was interesting. We were also told to write down at lest three words or letters that we would find associated with the band- that also fit our font. I have decided to go with the band EMA.

She is a songwriter from South Dakota and her songs can be described as being psychedellic, trippy, and intriguing. Her style is very gothic, while stage appearance is even more apparent. My font is abstract, and I feel it works well with this band because of the psychedellic vibe you get from when watching the music videos- especially her song "Satellites" and "CALIFORNIA".

Fontographer Transfer

With much frustration I have been able to somewhat successfully put in my type into fontographer and make it an actual working type. It really isn't that great, and there is some spacing issues between some of my letters, for reasons I don't really know how to fix- but for the most part it can be easily resolved by letting the kerning between the letters significantly drop. I'm thankful that we don't have to use every single letter, but for the most part I would like my font to at least be functionally working...

This is of Fontographer and how my font looked in the square boxes set up.

Week 5A Overview

We did not have class Tuesday, and were told to continue digging into our possible type we want to create. I took the time then to also work on Jamie and my website, to fix up the things that needed to be handled.

Thursday in class we worked with a new program called Fontographer, with a bit of some issues... It would appear that my chosen made up font is going to prove quite difficult to do. The program seems very useful, it's just getting to know how to use it that will be the troubling part.

Boxed Letters

I originally just thought we were supposed to save our letters in the little boxes with alligned x-heights, base lines, and so forth as .ai files for Tuesday. My apologies and fault that it's late to the blog as proof that I did the work.

I was able to successfully align all of my crazy typeface. Some of it looks off, but that's created by the illusion of the spikes I had created from the original sans serif letter.

Here is the upper case with and without the lines:

lower case and numbers with and without lines:

Type Proposal

I have a few proposals in terms of possible type projects. One of them involves being completely hand written and serve as an iconic font, or more rather iconic alphabet. Going off of what we were previously tasked with creating out own typeface, and finding ways to find letters through actual 3D objects- I would like to try my hand at digitally creating my alphabet. I would like to take a minimalist approach, with the capital letters having equal x-height along with the lowercase, but still having their own individual fun form. I would like to create an alphabet that focuses on the picture or creature or anything relating to the word itself, like 'a' for apple or 'c' for caterpillar.

The way I would go about this typeface would be to digitally hand draw it- first coming up with the concepts and possibilities of what goes with the letter best. Then I would trace what I have drawn digitally onto the computer, creating it in a minimalist way. In doing so, I can create an alphabet that is fun, playful, eye appealing, and holds some characteristics to it that- while it is playful, it creates the illusion of being free.

My kind of typeface would be more eye appealing to a younger audience. It really depends on what kind of theme I want to go with in terms of characteristics. I was thinking maybe some various shapes and forms of famous movie characters, or maybe animals that go along with the letter that kids can be familiar with. To take it though to a further level, I could create a type face revolving around animals that are on the verge of extinction, to bring awareness that these animals should be cared for and not hunted to the point of ceasing to exist. Other than that, however I don't think my kind of typeface could be used for anything else.

While I know that I wouldn't be experimental with 3D, I feel that it could at least bring an awareness to people about what we could be potentially ridding the world of, and hopefully they find it a mistake to even let it happen in the first place.

Webydo Space Jam

So far, this is how our Website looks for the revamp of SpaceJam. We have chosen to do a parallax scrolling.

Here is the critique that we received based on how our website is now compared to what we can do to improve it.

-----

Emily and Jamie: http://site9024293.90.webydo.com/?v=1

• The words “Space Jam” could be even bigger to fill more of the page. We’d like to see something else in the screen too when you see Space Jam, like the little rocket ship flying off the page.
• The parallax movements don’t feel like they settle until you’re at the very top of the page, sometimes you have to even scroll until it’s partially off the screen for it to settle. We’d prefer to see it settle in the middle of the screen.
• Navigation is really simple to understand.
• It would be nice if there was a different way to signify links other than blue and underlined (Even though we know that was a technical problem)
• The typeface for the paragraph is too condensed. There is so much space (haha pun) ← good one] on the screen that you could use a wider typeface that feels more open, similar to the typeface for “Jam Central”
• Use of icons is really nice!!
• Each section could be more uniform in color. We don’t think you need to entirely change color schemes between each section, or if you did the entire section could be the same color and the hierarchy in your text could come from size, font weight and negative space.
• You could actually just fill the entire screen with the icon and the paragraph and heading from each section, don’t need so much negative space
• Not sure if the stars at the top are a visual cue or just for decoration
• You could color code the spaceship in your navigation to the spaceship on the screen, same with the flag and the satellite

------

We plan to again work on possibly creating more space and visual representation, as well as fine tune the text, font size, and color.

Week 4A Overview

Tuesday:

Today we went over all of our words created using objects and / or images. There were a lot of amazing ones that really make me want to think outside of the box and redeem myself with how I took the perspective of our word. I feel really inspired and I want to try and be just as experimental. It's an eye opener to what can actually be achieved if you just give it a little bit more time and patience.

Thursday:

We continued to look over websites, good versus bad. The websites that I chose along with Jamie were as followed

-----

*3-5 Good Websites:  

http://www.etsy.com/ Etsy has easy accessability to finding hand made products. It is very well spaced and has good imagery (not responsive, some inconsistencies)

http://glyde.com/ glyde.com is for selling and trading in used games. It uses about three different hierarchies for titles and sub titles. it uses minimalist images, and the only other different typefaces correspond to top companies such as the NY times and CNN. The icons you scroll over are highlighted, indicating that they will take you to a different page while you are navigating through the slides. It is also responsive, but very strangely so.

https://www.apple.com/ Very simple, easy to use, what you are looking for is easy to find/right in front of you. Also has a very clean, balanced look and creates imagery to draw you in (not fully responsive)

*3-5 Good Typography Websites:

http://www.hm.com/us/ All the type is from the same family but they use different typographical emphasis to create hierarchy and lead your eye throughout the website. The type also fits very well with the brand (simple, classic, etc.) (not responsive)

http://departementcreatif.com/ This website uses creative typography and pairs it off well with all of the imagery they chose (yes responsive but it is a design website rather than a retail website)

http://moresoda.co.uk/ Moresoda is a very eye appealing website. The color choice makes the font pop along with bold typography throughout the homepage. There is also movement when hovering over specific icons. This makes the user browsing the website hooked. (not responsive because like stated above, it is company based)

-----

We then evaluated other students websites compared to our own. We are now moving into improving our website again based on the critique that we received from our peers. Jamie and I have a bit of work to do, but I feel like we are indeed still going in the right direction. I will be uploading what we have so far and go into depth on what we need to work more in order to bring the best out of this parallax scrolling website.

Project #2 Communicating Different Meanings of a Word

We were given the assignment to choose a word that emotionally associates with us. The word I decided to choose was "laugh." Laughter is very important to me. By using Typetester, I was able to find fonts that I felt would fit best for my word. The only problem is that they were unfortunately not website browser safety. Fonts I felt worked well to emotionally convey the message with my word were "Lobster", "Reenie Beanie", and "Tangerine".

Unfortunately I could not use any of them.

I did find that Impact was a good font choice, because it is a typeface that is very bold and pronounced, much like how I believe laughter can be.

I also chose Trebuchet MS. I find that laughter should be bold, boisterous, but also have a flow and a pattern. I liked how "g" and "a" had curls that gave themselves personality compared to the other letters in the word, and felt that it holds relevancy to the meaning of "laugh". Unfortunately I was having problems with making the word italic, since laughter is not just one kind of sound- so I chose to instead space the word out a little more as laughter is something that can carry a great distance.

I enjoyed the type MS Mincho because of its serifs and curves. With its small roundness upon the "g" and the sharp motion of the "a"s foot, it really brings a bit of spark to what laughter can also be. I had trouble still with making the type italic on screen compared to code (and this may be because on this computer I do not have the necessary font to see it as such).

The last type I decided to use was Courier New. I chose to make it smaller than it's original default size, as well as make the font thinner and also in italics. Laughter can be any kind of range. It can be loud and boisterous, but it can also be soft and short. I believed that the thinness of the font as well as having the light airiness shown in italics really shows the difference that laughter can be.

Aside from that, while doing this project, I can't help but stare at the word "laugh" and find it spelled super weirdly when presented to me in a larger font size. It just looks strange, or that could just be me.

Shown below is my coding.

Week 3A Overview

Tuesday:

Today was an experimental day. We looked over the type that people had created which was nice! Afterword, I got to work with Jamie again and we created several typography images based around the word- " K I T T E N " which is really funny since literally it was the first word that popped into both of our heads haha.

The images that we went with were both hand drawn, as well as very small 3D. We used bowties, markers, pencil, pens, and hair ties + tacs to create our word.

We also were responsible for each creating a 3D version of our word using any items. Jamie experimented with using shaving cream while I used cat objects my family owns around the house to create the word's imagery.

Thursday:

Today was looking over our websites that we recreated from the bad ones haha. I was partnered with Jamie, and we went with the Space Jam website. We received some great feedback, and plan to make some small changes to improve our scrolling website to make it even better! I will be posting pictures of our progress soon.

Two Type Faces Combined- Abstraction Distraction

This is what my final chosen typeface looks like! Phew. Took me forever!!

The Two Typefaces I chose are as such:

to create this typeface: