Wednesday, April 23, 2014

Mob Wars Wireframe

The interactive app I chose as my app is mob wars on Facebook. Its interactivity can compared to that of Farmville and candy crush and a few others. Mob wars is basically a game about the life of a mobster. you perform hits on people, take out mob bosses, perform heists and crimes all in an effort make money, and buy property while at the end of every hour will grant you a certain amount of money based on the hourly income that your property gives you. With the money, you can buy more property or buy weapons to make yourself stronger and much stronger in defensive in other mob attacks.




The affordances of this app is that it's very easy to use. Everything is the same at the top with each partition in the menu being on every page. That makes it very convenient to get from one screen to the next. Each partition has its own drop down menu that is just as easy to navigate as ever!

 
The constraints is located in a particular part of the app where you would go to buy property. What I have noticed to be a constraint is when you go to buy property, you have to guess how much you can buy without buying what you cant afford. This at times has caused me to spend unnecessarily because each time you buy property, its retail value goes up. This constraint can be made into an affordance  by creating an option saying "buy max" instead of buying until you run out of money.
 
The metaphor of this interactive app is the skyscraper picture that is used for the background picture for the app itself. This creates the visual atmosphere for the mobster atmosphere that encompasses the game. In my opinion, nothing can create a mobster atmosphere more than a view of city hi-rise building.
 

Tuesday, March 11, 2014

My examples of good and bad typography.


This is an example of good typography. The picture features words that are related to tourist destinations in London, some of which I've been to. What makes this particular piece of art interesting is that the words form shapes. Some of the words have stroke and no fill. some of the words have fill. Some of the words have a gradient going from high to low. In some of the words, it can be noticed that a piece from one letter can extend into the space of another letter all in an effort to visually create typographic structure. The colors of the words also simulate effects. one example is the water. The waviness also helps in giving the fluid effect. This picture, through beautiful typography, is a picture of the London Bridge alongside the River Thames.


This is an example of good typography. One can observe how the shape and heaviness of the letter can manipulate the boldness of the particular space thus creating more contrast. A heavier the letters carry more weight which can create more contrast. The thinner letters carry less weight which subsequently can lead to less contrast. It is especially interesting, from my perspective, that as you look at the picture, you can actually find yourself reading the text which will subsequently have your eyes going all over the picture. For those people that live in New York City, or take the MTA, they will quickly recognize this as the Kawasaki Train Model used for the 2, 4, 5, 6, Q, N, L and R trains. Another interesting element is the use of perspective. as if the weight and contrast of the text dont already have enough contrast, the further towards the pictures vanishing point you go, the smaller the text gets which is another visual effect created by the desire of perspective.


This is an example of good typography. The colors yellow and blue, are complimentary colors which makes for the perfect combination of colors with regards to text on a background. This kind of perfection being accomplished can create the most ease in readability, which is a factor that determines good or bad typography. The shapes in the ad as well as the shapes created by the text all form a visual symmetry which directs attention to the middle of the print advertisement. I've seen this ad many times and when I look at it, its almost as if i can draw the shapes created by the text.


This is an example of good typography. The brand is chobani. It is a greek yogurt. It has strawberry banana on filling on the bottom. It is a low fat yogurt. It has 2% milkfat. All of these things are facts about the yogurt, placed on the cup. All of it is in a good clean, easy to read layout. The brand of the yogurt, Chobani, carries the visual heirarchy. Greek Yogurt, is the secondary term which is in an appropriate small sizing under the brand. Not to mention that the main pieces of information, the brand and the yogurt, are in black type on a white background which highly supports the readability. It is the kind of readability that enables your eyes to catch this yogurt in an aisle in the supermarket or grocery store.The colors of the words Low-Fat yogurt and 2% milkfat are very fitting to a yogurt that is strawberry flavored. That color scheme of coral-pink goes together with the banner under the rim of the cup which says "Naturally Powering Team USA". Even the text in that banner, in contrast, goes with the background white color on the yogurt cup itself.


This paper bag from Chipotle's Restaurant is very interesting and is another example of good typography. What makes this interesting is the deviation from the straight-line type that you normally find in society. It has text on lines that curve. All of them curve in a consistent way that creates a pattern. Also the mixture of typography is what makes this design interesting. Some of the words have big typefaces. Some of them have small typefaces. Some of them have light and thin typefaces. Some of them have heavy and thick typefaces. Not even the line height among each line of type is consistent. Nevertheless, through all these variations in typography, it still has a high level of readability.


This is an example of bad typography.What makes it bad is the layout of the text. The typeface is rather easy to read, as is the contrast between the letters and the background. The spacing between the letters is not too bad even thought they all are a bit close together. The next thing that makes this informative ad such a horrible layout is the bad breaks which occur between Blvd and Archer Av. I feel that they could have used a smaller font which would have enabled more words to fin on one line. Justification can make a body of text look structurally proper and ready to be viewed. The method of forced justification in this design is extremely and undeservedly justified which in my opinion is just killing the typographic layout of the text.

This is an example of bad typography. What makes it bad is the layout of the text. This flyer is an advertisement for a cleaning service that my boss offers. I would feel guilty for throwing her flyer under the bus but its nothing personal. What has bothered me about this flyer is the horrible typography. Cams Cleaning Corp. For each of them, the C is spatially choked by all the letters following them. It looks as if the C's are being gagged by the letters that come after it. This sort of visual faux pas is the result of terrible kearning. Everytime I eyes meet this visual abomination, I cant help but realize how horrible the typography is.

This is an example of bad typography. What makes it bad is the layout of the text. What visually irritates me about this package design is the number of fonts that are present. The bold typeface at the top, the festive script typeface not too far below, the thin san-serif typeface directly below that one. Subsequently the tinier san-serif font directly below. I've seen heinz bottles of ketchup in the past and this one appears to me as a visual stickler. One of the irritating things about this is how they have Heinz twice. Why Why Why? Is it necessary? That was the first question I asked myself as i saw Heinz twice. As an alternative, I felt that it would have been far better if the bottle just said "Simply Heinz" and everything else it has to say.

This is an example of bad typography. What makes it bad is the layout of the text. EVERYTHING is too close together. The letters in each work are too close. The space between the lines are too small. from my visual standpoint, it seems as if they ran out of the space needed to properly ensure the adequate room of all letters and words. The serif fonts were a good option but I find it to be a bit of a stickler that everything is so close together. 

This is an example of bad typography. What makes it bad is the layout of the text. This to me looks retarded. There is clearly no reason to have the first letter of every word capitalized. The upper case letters  are scattered throughout the posting which adds to the confusion that is occurring. What makes things worse is that the standard lowercase text has an uppercase look to it. This makes it even more negatively unusual. "The Fish Factory Fresh & Cooked Seafood Eat Here or Take Out". As an alternative, The words Fish Factory could have been capitalized in big letters to strongly carry the visual heirarchy. Under that, the words "fresh & cooked seafood eat here or take out" could have been put in a smaller font to play the visual role as the subtext.