{"id":151,"date":"2013-11-20T22:20:32","date_gmt":"2013-11-20T22:20:32","guid":{"rendered":"http:\/\/www.confidant.ca\/blog\/?p=151"},"modified":"2013-12-02T22:41:29","modified_gmt":"2013-12-02T22:41:29","slug":"review-of-the-desolation-of-smaug-interactive-site","status":"publish","type":"post","link":"https:\/\/www.confidant.ca\/blog\/2013\/review-of-the-desolation-of-smaug-interactive-site\/","title":{"rendered":"Review of \u201cA Journey Through Middle Earth\u201d interactive site"},"content":{"rendered":"<p>I was excited to see what the folks at MGM\/Warner would come up with to promote the new movie The Hobbit: The Desolation of Smaug. HTML5 nowadays has some very interesting features so I wanted to see what a studio could accomplish with their truckloads of money. So naturally when \u201c<a title=\"The subject of this article\" href=\"http:\/\/middle-earth.thehobbit.com\/\">A Journey Through Middle Earth<\/a>\u201d got published, I ran to check it out. Clicked, I mean. Click-ran.<\/p>\n<p>The first thing I encountered upon visiting the site was that I needed to use the Chrome browser instead of my normal Firefox. This wasn&#8217;t a big deal to me because I understand that Chrome often has features that aren&#8217;t available yet on other browsers. Once in Chrome, I clicked the Begin button and waited. A long time. For the stuff to load. I&#8217;ve done my own bandwidth-heavy projects before, so I understand that the creative vision sometimes outweighs the technical limitations.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-156\" alt=\"Middle earth map\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map.jpg\" width=\"800\" height=\"473\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map.jpg 800w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map-500x295.jpg 500w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n<p>Finally, yay!\u2014I got an interactive map of Middle Earth. I was impressed with the photorealism and nice floaty clouds. Nice music too. Hey, what&#8217;s that thing in the left corner? Oh, a slideout menu, nice. I click a circle and the map zooms in. Nothing else happens. Should I click it again? There ya go, now it links to something.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-164\" alt=\"Trollshaw main screen\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw.jpg\" width=\"800\" height=\"471\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw.jpg 800w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-500x294.jpg 500w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n<p>I visited the Trollshaw area first. Nice graphics. I notice that the browser address bar has changed. Ungh\u2026more page loading. Can I click the browser&#8217;s &#8220;back&#8221; button to return to the map screen? Nope. What about that little map icon in the top right? Nope, that seems to be broken.<\/p>\n<p>So I wait for the page load and try it out. Hey, where did my side menu go? Oh, whatever. I drag the screen as the instructions explained, and it has a nifty movie-scrubbing effect used in combination with some parallax scrolling. The site seems to assume that users have a touch screen, so I (with my laptop\u2019s trackpad) am immediately fumbling to click and drag to the side. The imagery has been high-quality up till this point. Maybe worth the download time and only slightly gimmicky.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshow-screen.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-165\" alt=\"Trollshaw game\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshow-screen.jpg\" width=\"600\" height=\"355\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshow-screen.jpg 600w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshow-screen-500x295.jpg 500w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>On the last page I find some more trolls\u2014are these the same ones I just scrolled by? They look kinda different. I click \u201cExplore Further\u201d. It doesn&#8217;t work. So I reload the page and navigate back there, then it does the download.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game2.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-163\" alt=\"Trollshaw game top view\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game2.jpg\" width=\"800\" height=\"472\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game2.jpg 800w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game2-500x295.jpg 500w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n<p>Now I have a 3D game where I am told to use my arrow keys (assumes user has a keyboard) and &#8220;swipe to run&#8221; (assumes user has a mouse or touchscreen). I start with the arrow keys, having no clue where I&#8217;m supposed to run. Suddenly I&#8217;m confronted by a troll moving in slow-motion. Oh, I think, this must be the part where I switch to the gesture controls! Wham! He nails me. I got killed a few times doing this with the trackpad and finally had to plug in a USB mouse before I could get anywhere. Then I discover it&#8217;s super easy to finish the game. They show the obligatory social media links at the end of course.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-162\" alt=\"Trollshaw game first person\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game.jpg\" width=\"600\" height=\"354\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game.jpg 600w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/trollshaw-game-500x295.jpg 500w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>I visited the \u201cRivendell\u201d page next. A very long page load this time. More click-dragging, movie scrubbing and parallax. I drag to the right before Gandalf is done talking. Clicking Elrond&#8217;s button makes him start talking at the same time, which seems awkward. He didn&#8217;t even say \u201cpardon me\u201d.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-elrond.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-159\" alt=\"Elrond\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-elrond.jpg\" width=\"600\" height=\"353\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-elrond.jpg 600w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-elrond-500x294.jpg 500w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>I get to the end of the scrolling and click &#8220;Explore Further&#8221;. Another 3D interactive thing. For a second time I am struck by how different the 3D engine graphics look from the preceding experience.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-game.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-161\" alt=\"Rivendell game\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-game.jpg\" width=\"600\" height=\"356\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-game.jpg 600w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/rivendell-game-500x296.jpg 500w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>My task now is (are you ready?) to zoom through 3D space and swish my mouse over the little flowers in the valley. Really? Of all the things Middle Earth has to offer, I get to swish my mouse around? I laughed when I got to the end screen: &#8220;You made the most of your time in Rivendell.&#8221; Wow, these guys know how to party.<\/p>\n<figure id=\"attachment_155\" aria-describedby=\"caption-attachment-155\" style=\"width: 800px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/dolguldur2.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-155 \" alt=\"Dol Guldur\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/dolguldur2.jpg\" width=\"800\" height=\"470\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/dolguldur2.jpg 800w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/dolguldur2-500x293.jpg 500w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><figcaption id=\"caption-attachment-155\" class=\"wp-caption-text\">See those glowy eyes? That&#8217;s the Necromancer I guess.<\/figcaption><\/figure>\n<p>On to Dol Guldur. More download, scrubbing and parallax. I click to the game and once more I have to use both my keyboard and mouse. I walk 5 steps (I counted) and try to look around with my mouse. Some unseen thing roars at me, I spin around and apparently I am dead. I try this again several times. I only achieved another five seconds and the privilege of seeing the dark figure who is destroying my hair-do. I give up, wondering how much development time it took.<\/p>\n<p><a href=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map3.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-158\" alt=\"The locked levels\" src=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map3.jpg\" width=\"600\" height=\"314\" srcset=\"https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map3.jpg 600w, https:\/\/www.confidant.ca\/blog\/wp-content\/uploads\/2013\/11\/map3-500x261.jpg 500w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>Back to the map, it appears that three other locations are supposed to be part of this site, but they are locked. They don&#8217;t tell you if they are \u201ccoming soon\u201d or if I need to make some sort of achievement to unlock them. At this point, I really don&#8217;t care to see more.<\/p>\n<p>It started off great with the map, but the rest of the site leaves me thinking that it doesn&#8217;t do much to promote the Hobbit movies, which should have been the end result. It contained absolutely nothing about the new movie, and not enough from the first movie. I would rather have seen more content-related things, like character-related information, better sound and video clips. Factor in the errors and interface difficulties, and I leave the site rather disappointed.<\/p>\n<p>I think before starting such a project a development team would do well to take a page out of Nintendo\u2019s play book, meaning that the <a title=\"A somewhat relevant article\" href=\"http:\/\/www.uxmatters.com\/mt\/archives\/2009\/10\/testing-the-user-experience-consumer-emotions-and-brand-success.php\">user experience<\/a> needs to take precedence over raw technical achievements. Plan the site carefully before attempting any gaming or other experience. Consider the average user and what they are expecting. Test it lots before launching it.<\/p>\n<p>I hate to be so negative, but a site like this seems to be less about the user experience and more about \u201c<a title=\"An article from the developer\" href=\"http:\/\/www.html5rocks.com\/en\/tutorials\/casestudies\/hobbit\/\">what can we do using WebGL<\/a>\u201d. This certainly isn&#8217;t the first site that has suffered from this problem. I just wish it wasn\u2019t a site for the Hobbit movies, because I was expecting more.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I was excited to see what the folks at MGM\/Warner would come up with to promote the new movie The Hobbit: The Desolation of Smaug. HTML5 nowadays has some very interesting features so I wanted to see what a studio could accomplish with their truckloads of money. So naturally when \u201cA Journey Through Middle Earth\u201d &hellip; <a href=\"https:\/\/www.confidant.ca\/blog\/2013\/review-of-the-desolation-of-smaug-interactive-site\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Review of \u201cA Journey Through Middle Earth\u201d interactive site<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[5,3],"tags":[26,24,27,25],"class_list":["post-151","post","type-post","status-publish","format-standard","hentry","category-design","category-development","tag-hobbit","tag-opengl","tag-user-interface","tag-website"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p28GE6-2r","_links":{"self":[{"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/posts\/151","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/comments?post=151"}],"version-history":[{"count":9,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/posts\/151\/revisions"}],"predecessor-version":[{"id":172,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/posts\/151\/revisions\/172"}],"wp:attachment":[{"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/media?parent=151"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/categories?post=151"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.confidant.ca\/blog\/wp-json\/wp\/v2\/tags?post=151"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}