Embossing/Debossing – Inspiration #14

Embossing and dembossing are similar processes that create a different result. Both processes involve making a metal plate and a counter. The plate is mounted on a press and the paper is stamped between the plate and counter. This force of pressure pushes the stock into the plate, creating the impression.

Embossing produces a raised impression on your paper stock, while debossingcreates a depressed impression.

Creativity shouldn’t be measured by the learning of new technical skills. Being creative implies being able to express your original idea even drawing on a serviette. It’s not only the old school way. Being a proficient and creative designer is not based on systems but on the capacity to express coherent ideas to a desired target. What goes in realworld graphics goes well in web graphics too. Best example is what Embossing. As we see a trend in web graphics there are websites and mobile apps using debossed graphics extensively, As a graphics designer it is important to consider what kind of adjustments to be made to take print graphics to web graphics.

Flat Design and Skeuomorphism – Inspiration #13

In simple terms, flat design is a more versatile and sophisticated form of minimalism. Though you can make flat design look great even under minimalist constraints, these designs can also be much more complex with a clarity and crispness that is only possible once the 3D effects have been removed. Generally speaking, flat design is useful for making user interfaces easier to navigate, ensuring websites are faster and more functional – it is also seen as a starting point for the streamlining of designs.

What makes Flat design attractive:

  • Reduces Clutter: As we are constantly creating, evaluating and filtering content and since the public has an insatiable appetite for new information, we are in danger of being the victims of information overload. This problem is exacerbated by the decreasing size of the screens we use. Flat design helps to reduce the clutter on the user interface thus making information easier to digest.Skeuomorphism vs Flat-Design
  • Simplicity: We are seeing an increase in the number of apps and services online that offer basic features in a reversal of the usual trend, which involves lots of choices for high prices. Now customers can enjoy simple interfaces, fewer apps and a lower price.
  • Content Focus: When new devices arrive on the market, we initially want to see how they improve interactivity but the focus always returns to the quality of content. As most Internet users consume content via video, text or audio, they want the interface to move aside and flat design allows this.
  • Responsive Design: The increase in connected devices of different dimensions means that user interfaces have needed to become more fluid and the responsive design movement has come up trumps. It seems as if using flat design in user interfaces provides the best responsive design results. Another bonus is the reduction in the size of pages and subsequent reduced loading time.

Source : http://en.wikipedia.org/wiki/Flat_UI_Design

KKHS Landing page

IMG_20140521_231227

 

 

 

 

 

 

Initial layout sketch for KKHS landing page.

landing - v1

 

 

 

 

 

 

 

This is the First draft of the landing page for KKHS. It is a metro styled layout which makes easy for student to select what they want.

Comments – Lot of white space. Make use of the real estate.

– Align the tiles and the headings.

– Good use of color and grid. Tiles make it easy to select the  option.

Landing Page - final

 

 

 

 

 

 

 

 

 

This is the improved version of  KKHS landing page with icon sets designed in previous assignment. Files are uploaded to dropbox.

Power of design wire-frames – Inspiration #12

User centred design takes the main stage when it comes to creating responsive experiences, your users need to be able use your site with minimal extraneous thinking.  Responsive websites do away with frivolous design as your users goals become a priority. Mobile and tablet sites are touch driven, simple UX principles such as removing hover menus and increasing the size of buttons can make a site a lot easier to use.  This is a simplification of mobile design ideals but having a site that adapts to its environment is more than making it just stretch to a breaking point, it has to take into consideration the where, why and how it’s being used. Before a site construction even begins, its architecture and design should be planned out. Having a solid visual frame work that dictates all the different break points a site responds to can be useful. This can also be over kill and many designers prefer to outline a working style that can be adapted as the site is designed inside the browser

Motion Graphics – Inspiration #11

Motion graphics is a great way to convey and tell a story using moving images and various techniques like animation, CGI and cinematography. We’ve put together a new collection of some wonderful examples and pieces from some of you amazing mographers out there.

 Motion design is something I really want to learn. There is nothing I love more than seeing crazy cool animations, specifically because static image animations have sound and timing, which makes an incredible difference. One of my favorite types of animation are those that play with typography “The Sugary Death Machine” motion graphics. We hope you get a kick out of this visually entertaining post.

Identity system

14341669_121110043000 spotify-gift-cards-o spotify

 

 

 

 

 

 

Spotify : Consistent use of green, the typeface and the  logo across websites, flyers and gift cards makes the spotify one of the good Identity systems. Also the object edge curves and shapes are consistent across different print and web materials. what I like about spotify is the color and typeface used which makes it unique. Also the way green is used makes one associate this shade of green with spotify.

000002-01 images (1)

 

 

 

 

 

iVOMAT: iVOMAT uses white and greenish yellow across all the print and web materials. Arrow shape that separates theses two colors makes a unique shape that is used consistently by iVOMAT. This arrow looking shape is used even in the letterhead footer and logo. What I liked the most is use of the shape across the different forms. Also the shape is used in different ways like in log and in footer in different sizes yet maintaining the ratio and color combination which makes it unique.

20131004-02-AppleID

gmailios20 apple-iphone6 apple-iphone-5s-rear-camera-angle

 

 

 

 

 

 

Apple: Apple uses the custom typeface which is used across different products. And this typeface uses the particular gray hue which adds to the uniqueness. The gray shade is even used in hardware like macbook and iPad.  the apps i iOS uses a particular curvature and it is the same in dialogue boxes, apps and even iphone edges. What I like the most about apple identity system is the consistency across their products including hardware. Also the use of typeface across different platforms lke iOS and iCloud and iTunes.

 

6a842d2d98b3e137ddeab26792b1f070 images

 

 

 

 

 

Apartment therapy: Apartment therapy uses different color across different media. Orange logo and blue letter on business card. The typeface used in logo is different from that of letterhead. The main design aspect for an identity system is consistency and which was missing in this. Also I did not like the way typeface is used as it is different in different places. even the shape and corners visiting card does not match with the website.southerncomfort_fierypepper175__37003.1372861415.1280.1280TuacaKit

Southern-Comfort-sales-hit-by-rising-flavoured-brown-spirits-trend-Brown-Forman_medium_vga

 

 

 

 

Southern Comfort : It uses different typeface and color combination for the same product which makes identity system a fail. Southern Comfort uses white background and red font and sometime the colors are interchanged on same product. The outline around the text exists on some labels and absent on others.  As shown in the picture the fire symbol is used in all angles possible; which makes not so unique about the image. Also this design lacks repetition and consistency.

Landing page – Photo essay

 

Design1

 

 

 

 

 

 

 

The impressive design in this landing page is the opacity and the use of background image. It is black and white while the green bar in the foreground make is the text visible. The transparent layer above the green bar gives a classy and modern look to the landing page.

LP2

 

 

 

 

 

 

 

This landing page has made a good use of color and foreground-background  concept. The menu looks different yet clear and the green line indicating the menu which is active gives a rich look. Also the placement of video player and the dialogue box gives a 3-D effect

 

LP3

 

 

 

 

 

 

 

The good design aspect of this landing pages is the background-foreground look being represented via sticking login box. Also the logo color makes it stand out while the rest of the page is just black and white.

 

LP5

 

 

 

 

 

 

 

This is more of a information intensive home page where a lot of information is being conveyed via graphs and charts. The tile layout of displaying can be used for SUCCESS landing page as it make easy to navigate.

 

lp4

 

 

 

 

 

The tile layout o this page make more appropriate for SUCCESS program land page because it makes easier for student to select the option they want. Also the color distinguishes the category from the others. mixed use of large images and tiles along with color combination makes the design ideal for SUCCESS program.

Computer generated Imagery – Inspiration #10

 

3D renders really impress me. It’s incredible how some designers recreate things from real life on a computer, creating what we may call simulated pictures. Sometimes, we can’t even tell whether an image is real or a computer graphic, and that’s freaking amazing.

I came across this amazing realistic 3D Computer Graphics that impressed me a lot for its rendering and textures, which turned this computer generated images into real pictures of another world. It involves a great deal of precision and effort to generate a simple computer graphics that looks like a real world object. Developing a human face on computer is a extremely difficult task and the technology enables us to do that is simply amazing.

– See more at: http://abduzeedo.com/amazing-realistic-3d-computer-graphics#sthash.cBimZBlf.dpuf

 

Source : http://www.stumbleupon.com/su/1y0oRv/abduzeedo.com/amazing-realistic-3d-computer-graphics/