{"id":31755,"date":"2017-08-18T03:01:00","date_gmt":"2017-08-17T17:01:00","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=31755"},"modified":"2017-08-18T07:28:49","modified_gmt":"2017-08-17T21:28:49","slug":"merging-photos-via-gimp-and-iphone-camera-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/merging-photos-via-gimp-and-iphone-camera-primer-tutorial\/","title":{"rendered":"Merging Photos via Gimp and iPhone Camera Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"Merging Photos via Gimp and iPhone Camera Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.jpg\" title=\"Merging Photos via Gimp and iPhone Camera Primer Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">Merging Photos via Gimp and iPhone Camera Primer Tutorial<\/p><\/div>\n<p>Mobile devices are great for the taking of photographs out and about.  These mobile devices, such as the iPhone, have loads of Sharing options, and our most used method here is Mail (ie. email).  Download the email attachments to your &#8220;work&#8221; laptop, ours a MacBook Pro, and there is where &#8220;the fun&#8221; regarding orientation, can often surprise.  At first we followed these procedures after downloading two iPhone photos of some trees.<\/p>\n<ul>\n<li>opened images (ie. photos) with Mac OS X Preview desktop application, and they appeared correctly orientated, so used it to Save As to \/Applications\/MAMP\/htdocs\/ which is Document Root for our <a target=_blank title='MAMP' href='http:\/\/mamp.info'>MAMP<\/a> HTTP:\/\/localhost:8888\/ for both images<\/li>\n<li>wrote today&#8217;s new web application <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.html_GETME\" title='merge_photos.html'>merge_photos.html<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.html\" title='Click picture'>live run<\/a> accessing the two images above and found that the images were rotated 90 degrees clockwise, wrongly<\/li>\n<\/ul>\n<p> &#8230; so &#8230; take two &#8230; involve <a target=_blank href='http:\/\/www.gimp.org' title='Gimp, or GIMP'>Gimp<\/a> &#8230; remember <a title='Photo Album Email with Gimp and Paintbrush Primer Tutorial' href='#paegppt'>Photo Album Email with Gimp and Paintbrush Primer Tutorial<\/a> &#8230;<\/p>\n<blockquote cite='https:\/\/www.rjmprogramming.com.au\/ITblog\/photo-album-email-with-gimp-and-paintbrush-primer-tutorial\/'><p>\nthe best image editor to open this big file with is Gimp (by a long stretch) &#8230; it detects <a target=_blank title='Exchangeable Image File Format' href='http:\/\/en.wikipedia.org\/wiki\/Exchangeable_image_file_format'>EXIF<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/PhotoAlbum_Scan-51of.jpg\" title='Gimp detects EXIF ... Paintbrush does not'>settings<\/a> and offers to rotate the image to its proper orientation, and will always show it fitting into the screen you have (ready to be sliced up?) &#8230; while Paintbrush leaves a huge image running off the screen\n<\/p><\/blockquote>\n<ul>\n<li>opened images (ie. photos) with Mac OS X Gimp desktop application, and as they opened we were offered the chance to Rotate the images to their EXIF information orientation, so did this Rotation, then used it to Save As to \/Applications\/MAMP\/htdocs\/ which is Document Root for our <a target=_blank title='MAMP' href='http:\/\/mamp.info'>MAMP<\/a> HTTP:\/\/localhost:8888\/ for both images<\/li>\n<li>retried today&#8217;s web application <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.html_GETME\" title='merge_photos.html'>merge_photos.html<\/a>&#8216;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.html\" title='Click picture'>live run<\/a> accessing the two images above and found that the image orientation was better<\/li>\n<\/ul>\n<p>So what is this very simple web application doing.  At this early stage, all we are starting off doing is to &#8230;<\/p>\n<ul>\n<li>take two images<\/li>\n<li>horizontally align the two at the start<\/li>\n<li>make the right hand image gradually move over the top of the left hand image &#8230; and while moving this way &#8230;<\/li>\n<li>as the movement occurs, reduce the <i>opacity<\/i> (that starts as 1.0) of both left and right images to eventually become 0.3 at the end of the &#8220;overlaying&#8221; movements<\/li>\n<\/ul>\n<p>Simple, huh?!  You get results such as shown in today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/merge_photos.jpg\" title='Tutorial picture'>tutorial picture<\/a> of &#8220;merged photos&#8221; and these effects can be quite interesting.  Given the same camera used for the images concerned, you can probably not have to worry about different sized images here, which would &#8220;cruel&#8221; this web application&#8217;s simplicity, though down the track we may have to cater for this scenario, regarding plans for the future, here.  But we will be returning to explore more <a target=_blank title='Overlay' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/tagoverlay'><i>&#8220;overlay&#8221;<\/i><\/a> thoughts here, as time goes on.<\/p>\n<hr>\n<p id='paegppt'>Previous relevant <a target=_blank title='Photo Album Email with Gimp and Paintbrush Primer Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/photo-album-email-with-gimp-and-paintbrush-primer-tutorial\/'>Photo Album Email with Gimp and Paintbrush Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/\"><img decoding=\"async\" style=\"float:left; border: 15px solid pink;\" alt=\"Image Fits in Gimp and Paintbrush Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/PhotoAlbum_Scan-65of.jpg\" title=\"Photo Album Email with Gimp and Paintbrush Primer Tutorial\"    \/><\/a><p class=\"wp-caption-text\">Photo Album Email with Gimp and Paintbrush Primer Tutorial<\/p><\/div>\n<p>Were you surprised with our tutorial <a target=_blank title='Image Fits in Gimp and Paintbrush Primer Tutorial' href='#ifigappt'>Image Fits in Gimp and Paintbrush Primer Tutorial<\/a> as shown below, where Paintbrush ended up being a better option for an image editing job than Gimp, which we also use a lot here at this blog?<\/p>\n<p>Find myself, though am no graphic &#8220;artist&#8221;, really, that an open mind about image editing decisions is good.<\/p>\n<p>Take today&#8217;s job, on a MacBook Pro laptop (desktop) using Mac OS X (Yosemite), of taking a Photo Album set of four photos and being able to end up sending one of them as an attachment in an email.  By the way the Photo Album is a real book &#8230; gasp!<\/p>\n<p>There were several issues &#8230; aren&#8217;t there always? &#8230;<\/p>\n<ul>\n<li>the MacBook Pro laptop is <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/PhotoAlbum_Scan-19of.jpg\" title='Set up'>hooked up<\/a> to our HP Printer (Hewlett Packard Deskjet 2050 J510 series) via a USB lead and we start up via System Preferences&#8230;-&gt;Printers &amp; Scanners button-&gt;Scan tab-&gt;Open scanner button<\/li>\n<li>after a few &#8220;garden path&#8221; moments, should have known, but &#8230; doh! &#8230; if there are rotations involved in a process, and you have the choice of two places to apply that rotation, find 90% of the time it is best to make use of the first opportunity to do it &#8230; but with the HP Scanner used, this involved non-default format decisions &#8230; you&#8217;ll see that with the final <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/PhotoAlbum_Scan-48of.jpg\" title='Set up'>scan settings<\/a> settled upon<\/li>\n<li>it is pretty fanciful to think you will get resolution back once you ever do a step to relinquish it (ie. only relinquish it, as needed, right at the end such as when saving as a Jpeg file and you can pick a resolution of save), so it is probably good to decide to scan a Photo Album (old) photo with maximum <a target=_blank title='Dots per inch information from Wikipedia ... thanks' href='http:\/\/en.wikipedia.org\/wiki\/Dots_per_inch'>dpi<\/a> setting &#8230; which was 1200 for us &#8230; but results in a file more than 15mB big &#8230; unless you are really short of diskspace, don&#8217;t panic &#8230; we fix things later regarding file size<\/li>\n<li>the best image editor to open this big file with is Gimp (by a long stretch) &#8230; it detects <a target=_blank title='Exchangeable Image File Format' href='http:\/\/en.wikipedia.org\/wiki\/Exchangeable_image_file_format'>EXIF<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/PhotoAlbum_Scan-51of.jpg\" title='Gimp detects EXIF ... Paintbrush does not'>settings<\/a> and offers to rotate the image to its proper orientation, and will always show it fitting into the screen you have (ready to be sliced up?) &#8230; while Paintbrush leaves a huge image running off the screen<\/li>\n<li>personal preference from here, for me, was to copy the quarter of the image with my photo of interest and copy this to the clipboard via Gimp&#8217;s (or lots of application&#8217;s) Edit-&gt;Copy (after selecting area of interest, with the Rectangular Select option)<\/li>\n<li>open Paintbrush with File-&gt;New from Clipboard<\/li>\n<li>use Paintbrush Image-&gt;Image Size&#8230; with 10% 10% resizing<\/li>\n<li>use Paintbrush File-&gt;Save As&#8230; to save to a Jpeg file of about 50% density &#8230; voila &#8230; manageably small file 33kB<\/li>\n<li>open Finder and right-click-ize <a target=_blank title='The resultant photo' href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/One_We_Want.jpg\">it<\/a> (double finger down gesture) to pick the Share-&gt;Mail option &#8230; opens Mail, with your photo attached in a fresh new email, ready for you to construct your email<\/li>\n<\/ul>\n<p>Please enjoy today&#8217;s <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/Mac\/PhotoAlbumEmail\/\" title='Click picture'>tutorial<\/a>.<\/p>\n<hr \/>\n<p id='ifigappt'>Previous relevant <a target=_blank title='Image Fits in Gimp and Paintbrush Primer Tutorial' href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=12600'>Image Fits in Gimp and Paintbrush Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a id='myva' onclick=\"window.open('http:\/\/www.rjmprogramming.com.au\/PHP\/video_generic.php?filen=ImageFit_Paintbrush&#038;pat=Mac\/&#038;dom=http:\/\/www.rjmprogramming.com.au:80\/','_blank','top=500,left=20,width=900,height=400');\" target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/video_generic.php?filen=ImageFit_Gimp&#038;pat=Mac\/&#038;dom=http:\/\/www.rjmprogramming.com.au:80\/\"><img decoding=\"async\" style=\"float:left; border: 15px solid pink;\" alt=\"Image Fits in Gimp and Paintbrush Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/ImageFit.jpg\" title=\"Image Fits in Gimp and Paintbrush Primer Tutorial\"    \/><\/a><p class=\"wp-caption-text\">Image Fits in Gimp and Paintbrush Primer Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s tutorial <a target=_blank title='Xcode Swift Image Assets Primer Tutorial' href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=12571'>Xcode Swift Image Assets Primer Tutorial<\/a> needed lots of image &#8220;fitting&#8221; to go on <strike>man<\/strike> person.  On a Mac desktop with a MacBook Pro laptop, we find (Mac) Paintbrush to be that little bit friendlier than Gimp to use for this particular job if you have those two images as per &#8230;<\/p>\n<blockquote>\n<ul>\n<li>make one image about 1024&#215;768 that you find apt<\/li>\n<li>make one image about 200&#215;200 that you find apt<\/li>\n<\/ul>\n<\/blockquote>\n<p> &#8230; already existant.  You&#8217;d have to play our videos <a id='myva2' onclick=\"window.open('http:\/\/www.rjmprogramming.com.au\/PHP\/video_generic.php?filen=ImageFit_Paintbrush&#038;pat=Mac\/&#038;dom=http:\/\/www.rjmprogramming.com.au:80\/','_blank','top=500,left=20,width=900,height=400');\" target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/video_generic.php?filen=ImageFit_Gimp&#038;pat=Mac\/&#038;dom=http:\/\/www.rjmprogramming.com.au:80\/\">today<\/a> to see that extra default panning ability of Paintbrush to see what we mean, but when you can crop and fit all at the same time this is quite advantageous, but am not saying in Gimp you can&#8217;t do this, it is just that it is not the default in Gimp, and when you are doing a lot of something, that small difference can have quite an <a target=_blank title='effect versus affect' href='http:\/\/web.ku.edu\/~edit\/affect.html'>effect<\/a>.<\/p>\n<p>So the three images involved were &#8230;<\/p>\n<ul>\n<li><img decoding=\"async\" alt=\"Image Fits in Gimp and Paintbrush Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/1024_768.png\" title=\"1024x768 original\"    \/><\/li>\n<li><img decoding=\"async\" alt=\"Image Fits in Gimp and Paintbrush Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/300_300_gimp.png\" title=\"300x300 derived via Gimp\"    \/><\/li>\n<li><img decoding=\"async\" alt=\"Image Fits in Gimp and Paintbrush Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/Mac\/300_300_paintbrush.png\" title=\"300x300 derived via Paintbrush\"    \/><\/li>\n<\/ul>\n<p>If you want to read about the video player program today, please consult <a target=_blank href='http:\/\/www.rjmprogramming.com.au\/wordpress\/?p=10511' title='PHP\/Javascript Media Synchronize Cross Browser Tutorial'>PHP\/Javascript Media Synchronize Cross Browser Tutorial<\/a>.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d12600' onclick='var dv=document.getElementById(\"d12600\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?tag=gimp\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d12600' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr \/>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d12600' onclick='var dv=document.getElementById(\"d12600\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"http:\/\/www.rjmprogramming.com.au\/wordpress\/?tag=paintbrush\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d12600' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d31755' onclick='var dv=document.getElementById(\"d31755\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/gimp\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d31755' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Mobile devices are great for the taking of photographs out and about. These mobile devices, such as the iPhone, have loads of Sharing options, and our most used method here is Mail (ie. email). Download the email attachments to your &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/merging-photos-via-gimp-and-iphone-camera-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,16,20,30,37],"tags":[183,281,360,380,406,491,576,590,634,652,738,2281,889,894,1738,929,997,1072,1137,1319],"class_list":["post-31755","post","type-post","status-publish","format-standard","hentry","category-elearning","category-gimp","category-ios","category-photography","category-tutorials","tag-camera","tag-css","tag-download","tag-email","tag-exif","tag-gimp","tag-html","tag-image","tag-iphoto","tag-javascript","tag-mail","tag-merge","tag-orientation","tag-overlay","tag-photo","tag-photograph","tag-programming","tag-rotation","tag-sharing","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/31755"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=31755"}],"version-history":[{"count":5,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/31755\/revisions"}],"predecessor-version":[{"id":32245,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/31755\/revisions\/32245"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=31755"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=31755"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=31755"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}