Use photoshop to create a photo montage image like the one below.
Search for specific technique: Photomontage
Artform that became extremely popular in the early 20th Century. Particularly popular in German Expressionism and Dadaism. Click the images for links to the original images or sites:
Photomontage: Amir Ebrahim Photography
Massive Attack – The Essential Mix
Create the Image in Photoshop
Create a similar photomontage to the one above by Amir Ebrahim Photography. Find a photo to base it on and copy and paste layers and change the image colour and tone.
Make sure to apply the meta data to the final product before saving it as a JPEG and PSD.
Email the JPEG
Email the JPEG to me.
Student Examples
Below are examples by students:
to be posted
Feedback
Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!
Please read the text word by word and … no actually, let us move to greener pastures:
Applying Meta Tags
It would help to actually know what meta tag means:
A meta tag is basically a tag in HTML that describes the contents of a Web page.
We will look at different ways to apply meta data to files:
Applying meta data with Photoshop
Applying meta data with Adobe Bridge
Applying meta data with meta tags in HTML
Applying Meta Data in Photoshop
Question to the class: why do you think it is important to apply meta data in the first place?
Do not read any further…
We will apply meta data in Photoshop with File>File Info… or with the shortcut: Alt+Shift+Ctrl+I.
This opens a window and you will be able to enter information in there. Let us focus on a title, the name of the creator (you) a copyright statement, a description and keywords.
Creating a Poster in Photoshop
Before you can apply any data to a Photoshop document though, you need to have a Photoshop document. So, let us begin with some fun:
In 1:20h create a poster that is inspired by either Swiss International Style, Constructivism or the Vietnamese Propaganda Poster.
Feel free to use some of your own art work or appropriate imagery found online.
Make sure to apply the meta data to the final product before saving it as a JPEG and PSD.
E-mail the JPEG to me! 🙂
Inspirations for today’s task:
Swiss International Style – an iconic style of graphic design from the 1950s, strongly influenced by the ideals of the German Bauhaus – Click the image for a Google search on Swiss Style:
Swiss International Style
Constructivism – The immensely graphic art and propaganda style of Communist Russia, or to be more precise, of the Soviet Union. Early 1920s – 1940s. Click the image for a Google search on Constructivism:
Constructivism
Vietnamese Propaganda Posters – this is a particular style popular in Communist Vietnam. Visually very flat with the use of rich patterns and stunning in colour scheme. I feel very attracted to this style. Vietnam particularly in 1960s and 1970s. Click the image for a Google search on Vietnamese Propaganda Poster:
Vietnamese Propaganda Poster
Feedback
Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!
Student Examples
Below are examples by students:
Milk Poster – Swiss International Style Reference – by Annabel Stephen SalipConstructivism Reference – by Lylah LivingstonPink Ribbon Day – Swiss International Style Reference – by Hwan RochanabuddhiZig Zag – Swiss International Style Reference – by Nawras Shakeer
Peace- Swiss International Style Reference – by Maryam Chananeh
I will walk around and provide feedback on your work. Make sure that you consider the Visual Hierarchy of your work.
Create a layout of your work from basic outlines and place numbers against the different elements or pieces.
Is there one element that stands out the most? Are they all equal? Boring!!! You want to create a piece that is dynamic! For it to be dynamic it needs:
some movement
an entry point to the work (this is the first piece or element in your visual hierarchy)
a second, third, and other pieces in your Visual Hierarchy
A focal point – this can be achieved by an arrow pointing, a person pointing, a person looking at the focal point, the direction of text, etc
Example for Visual Hierarchy – based ‘Think small’ Advertisement for VW Beetle by Helmut Krone, 1960
The image of the Beetle advertisement by iconic graphic designer Helmut Krone is a good example for a clear Visual Hierarchy.
Product image – due to position (we are trained to look at the top left first), high contrast (darkness of the beetle against the white background helps to make it stand out), generous use of white space (makes the image visually more important).
Heading – due to position (it is positioned on the path to the next elements), bold and larger than body text, high contrast.
Body text – position and size of text area. You could argue that the logo is visually as important.
Logo – position, size (opposed to text) and white space around the logo.
The advertisement can be found at the AIGA Design Archives (and many other sites).
Scale – play with the size of things! Do not accept the first concept that you create. Rearrange it and change the scale of one element. How does the work look if one element is much larger?
Playing with the scale should be a lot of fun! In illustrator you might need to group some elements (Ctrl+G/Cmd+G) and select with V, the Selection Tool and drag to increase or decrease.
The easiest way to integrate Meta-data into a file in Photoshop is to open the File Info Sheet: click File>File Info from the drop menu or use the short cut: Shift+Ctrl+Alt+I to open the window.
Next enter your information into the text fields. You want to add a title, name of author (creator), description, keywords and a copyright status.
Shift+Ctrl+Alt+I or File>File Info…Example of File Info being filled in.
Inspirations for Your Assessments
We were discussing different trends and inspirations in class. Here are some ideas and inspirations. Click on the images to activate a Google Image Search for the type of images in the thumbnails.
Retro Book Cover Illustrations 50s – Click the image for a Google SearchRetro Futurism – Click the image for a Google SearchVintage Book Illustration – Click the image for a Google Search
Please open your assessment 1 – Student Diary Cover; I will walk around and look at everyone’s progress. Please open up anything you have done.
I would like to see some ideas and concepts at this stage, a description of the target audience and possibly you might have started on the project in Photoshop, Illustrator or InDesign. I will spend approximately 20 mins on this.
Inspirations for Assessment 1 – Student Diary
Swiss International Style – an iconic style of graphic design from the 1950s, strongly influenced by the ideals of the German Bauhaus – Click the image for a Google search on Swiss Style:
Swiss International Style
Constructivism – The immensely graphic art and propaganda style of Communist Russia, or to be more precise, of the Soviet Union. Early 1920s – 1940s. Click the image for a Google search on Constructivism:
Constructivism
Vietnamese Propaganda Posters – this is a particular style popular in Communist Vietnam. Visually very flat with the use of rich patterns and stunning in colour scheme. I feel very attracted to this style. Vietnam particularly in 1960s and 1970s. Click the image for a Google search on Vietnamese Propaganda Poster:
Vietnamese Propaganda Poster
Photomontage – Artform that became extremely popular in the early 20th Century. Particularly popular in German Expressionism and Dadaism. Click the images for links to the original images or sites:
Photomontage: Amir Ebrahim PhotographyMassive Attack – The Essential MixCouple found at http://frenchbydesign.blogspot.com.auruthworkx -http://ruthworkx.files.wordpress.comMosaic of Sofia Coppola – by Maurizio Galimberti – http://www.mauriziogalimberti.itPhoto Montage by SGlider12 on Webdesign.org – Click image for great Gimp tutorial
Assessment 2 – Design a GUI
This assessment covers this class for these units: Create Visual Design Components and Analyse Information and Assign Meta-Tags and Create A User Interface.
Due Date: in July
Design a Graphic User Interface. You can choose to design for a Website or App.
First: think about a project. What do you want the GUI to be for? Think about a client scenario, who is your client and what is the purpose of the site or app? What do you want the user to do after visiting it?
Develop sketches and refine your design in Photoshop.
You will need 4 pages (example Website: home, about us, portfolio, …)
Make sure to include:
Platform consideration – basically decide on the output platform and write it down
Dimensions – at what size will the user view your GUI?
Target Audience – Visit class 3 for ‘Visual Design Components’ for ideas on how to develop your target audience.
Influences – ‘screenshot after screenshot’, capture screenshots of influences, look up sites that influenced you.
UCD considerations, design your GUI around User Centred Design considerations
Follow a step by step approach for your design process – Visit class 2 for ‘Visual Design Components’ for examples of a design process
You will need to supply original photos taken by you! Each photo needs meta-data assigned to it. Include photographer details, tags, image title, copyright statement. Include a folder with the edited images with meta-data.
Photo Montage by SGlider12 on Webdesign.org – Click image for great Gimp tutorial
Uncle Sam Wants You, WWI Propaganda Poster for US Army recruits, Design by James Montgomery Flagg, 1916, image found at: Live Auctioneers
The grass layer has been turned into a clipping mask with the shape of the rabbit below.
Fruity Design – This is great for a menu, very appetizing thumbnails – found at: WeddingPhotography.com
Pink Ribbon Day – Swiss International Style Reference – by Hwan Rochanabuddhi
The Glossy Reflection is transparent on top and gets whiter towards the bottom.
Text and Shapes – This design lends itself to an interactive use – found at: Smashing Magazine (click image for inspiring article on table of content design)
Concept for Gallery Screnshot
Experimental Photomontage by Robert Heinecken
Photomontage: Amir Ebrahim Photography
Light Streaks – Courtesy of: PhotoshopEssentials
Italian movie poster found on Abduzeedo.com
Free Transform and Ctrl – I am loving it!!!
Text-based Table of Content – Very Graphic and Black and White- found at: Smashing Magazine (click image for inspiring article on table of content design)
Luminescent Lines – Courtesy of: PSDLearning
Photo by ariadna on morgueFile
Photo by frenchbyte on morgueFile
Contemporary design in style of Construcitvism by Teo Brito found at LauraGreen92 – click image for more information and link to her blog
Source: morgueFile, Photo by matei
Work by Egon Schiele, found at Mom.org
Table of Content from Textbook – This design lends itself to an interactive use – found at: Smashing Magazine (click image for inspiring article on table of content design)
Finding the Right Candidate for a Job… – Photo AdamRiley from www.projectnoah.org
Courtesy of The Art of Mass Effect Universe’, 2012
Based on a photo by delboysafa from morgueFile.com
Custom Shapes and Custom Shape Icon
Courtesy of The Art of Mass Effect Universe’, 2012
Mosaic of Sofia Coppola – by Maurizio Galimberti – www.mauriziogalimberti.it
Grassy Rabbits
Illustration by Tavis Coburn found on DzineBlog.com
Layers in Photoshop are like a Collage of images stuck on top of each other…
Illustration by Kate Miller, found on DzineBlog.com
Photo by matthewbridges on morgueFile.com
Geese in Ameland, Photo by Frans Schouwenburg
Vista Lighting Effect – Courtesy of: Tutorial9
The Face by drfranken found on ChromoArt.de
Found at Inc.com
Photo by dharder on morgueFiles.com
Outlined text changed in size and colours dropped into the individual letters with Eyedropper tool using LMB + Alt
Setting the grid up.
Photo by clarita on www.morguefile.com
Study – Lines and Grace Kelly – by Federico Viola photo: courtesy of GettingCheeky.com and curved lines wallpaper: courtesy of FreeFever.com
Michael Pointing in GTA V – Courtesy of Rockstar
Colours, Numbers and Boxes – very happy and alive, personally I do not like the distortion of the word content – found at: Flickr
Your Lipstick Needs You, an entertaining take by Digital Media Artist Samantha Cain. Courtesy of: Samantha Cain, http://www.behance.net/samanthacain
Photo by clarita on morgueFile
Study – Lines and Grace Kelly – by Federico Viola photo: courtesy of GettingCheeky.com and curved lines wallpaper: courtesy of FreeFever.com
Examples of Output and Display for web-content. Image: live.surveyshack.com
Image source: Data Center Knowledge
Work by Justin Anderson
Some of us have there most enjoyable moments in nature at the beach, Photo by rivediamoci on morgueFiles
ruthworkx -http://ruthworkx.files.wordpress.com
From ‘Henri’s Walk to Paris’ 1962 – children’s book by Saul Bass Found at: Brainpickings.org
Illustration: Tavis Coburn – Illustration for for an article predicting trends in Apple’s mobile strategy. Found on: TavisCoburn.com
I Want You – Emily Strange, The lovable Emily Strange came to life in 1991, designed by Nathan Carrico for Santa Cruz Skateboards. She is referred to as a counterculture icon. I would just call her a sceptic. Image found at: Kollectable Kaos
Screenshot of Endless Alphabet 2, courtesy of AppsPlayground.com
Photo by agathabrown on morgueFile
Multimedia Production Cycle – This image is under the Creative Common Agreement, you can use it but will need to reference this site: www.classoffederico.wordpress.com
Based on photo by hotblack from morgueFile.com
Photo by hotblack on morgueFile.com
Milk Poster – Swiss International Style Reference – by Annabel Stephen Salip
Illustrator unknown – found at: Ephemera – World of Rare Books
This is a template for a business website found at TemplateMonster. It is interesting in the sense that it breaks up the main image as part of the navigation. The sound it comes with is annoying.
Image Source: www.photoshopessentials.com
Illustration by Gary Neill found on Dzineblog.com – http://garyneill.com/ http://garyneill.tumblr.com/
Illustration: Jamie McKelvie – Art Brut Record
Photo by Seemann on morgueFile.com
Based on image by hotblack on morgueFile.com – F.Viola
Swiss travel poster from 1934 by Herbert Matter – Source: http://swisstype.wordpress.com/work/
From ‘Henri’s Walk to Paris’ 1962 – children’s book by Saul Bass Found at: Brainpickings.org
Screenshot – 82 Everyone is a Marketer by Seth Godin from What’s Your Story by Joyce Hostyn
Illustration by Jessie Ford, found on DzineBlog.com
Photo by mconnors on morgueFile
‘For Great Road Trips: Switzerland’ Poster by Herbert Matter in (Swiss) International Style – Source: http://swisstype.wordpress.com/work/
“Step into my office” Source: The Age, click image for link
Lines and Gradients- Courtesy of: psdtuts+
A Beautiful Piece by Aerosol found on his Facebook
Image from morgueFile by lemai13
What Time is it Now? by King_Bobbles
Based on photo by xandert found on morgueFile
Photo by DTL on morgueFiles
He loves OHS! – Photo by Karpati Gabor on morgueFile
Only practice will help you learn! Photo by BreonWarwick on morgueFile
The concept was used on the German side as well with this ‘Auch du sollst beitreten zur Reichswehr’ [You too should join the German Army], design by Julius Engelhard, Image: courtesy of mental_floss
Text and Shapes – This design lends itself to an interactive use – found at: Klafferty.com
The calming effect of horizontal lines, image: courtesy of flickr.com, Photographer: jaikdean
The gentle curve of the river and the light green tones of the grass give this image a calming feel. The montains and the clouds have a less calming effect. Image: courtesy of Icon Photography School – http://www.photographyicon.com/line/
Typographic with Colours and Photos – The use of large numbers is effective and the low opacity of the boxes works, personally, I find it looks a bit dated- found at: JuxtaPost.com
Illustration: Jamie McKelvie – Suburban Glamour Comic Series
Peace- Swiss International Style Reference – by Maryam Chananeh
Vertical lines of a dark fence, image courtesy of p.ic – Photo Internet Collection – www.photoic.wordpress.com, photographer: Federico Viola
Massive Attack – The Essential Mix
Illustration by Jessie Ford, found on DzineBlog.com
Using the Reflect tool (o) to reflect the i downwards as if it has collapsed in front.
Couple found at http://frenchbydesign.blogspot.com.au
Screenshot from What’s Your Story by Joyce Hostyn
Photo by mcconnors on morgueFile
Britons, Lord Kitchener Wants You! Propaganda poster design from WWI by Alfred Leere. Image: courtesy of WorldWarEra.com
Based on photo by dhester from morgueFile.com
Good Morning! Photo: wallyir, from: morgueFile.com