Imaging & Data Visualisation

Link to Flickr Page: https://www.flickr.com/photos/115986378@N03/

Micro Page: https://www.flickr.com/photos/115986378@N03/sets/72157640922857563/ Macro Page: https://www.flickr.com/photos/115986378@N03/sets/72157640920267095/

Experimental Photographs

1507640_10201897793266626_8765355542738727915_n 1613904_10201897796986719_5957381115142873219_n 10157291_10201897794106647_4833749690506476710_n 10169198_10201897797226725_982171678109786319_n 10177361_10201897797786739_3613929365335924339_n 10247385_10201897793106622_6664948867130248037_n 10256136_10201897793866641_7350857859180692843_n 10256186_10201897798146748_2197151473849246314_n 10268627_10201897793466631_7221440243875691373_n 10273917_10201897796826715_8353701599709494603_n (1) 10290637_10201897793666636_4766982519855516346_n 10322640_10201897797546733_7150920827104522260_n 10336700_10201897796586709_7096025549970384347_n

[★]

 ate
IMG_2067 IMG_2068 IMG_2070 IMG_2071 IMG_2073 IMG_2074 IMG_2075 IMG_2099 IMG_2100 IMG_2101 IMG_2102 IMG_2107 IMG_2108 IMG_2110 IMG_2112 IMG_2133 IMG_2134 IMG_2136 IMG_2140 IMG_2143 IMG_2145
DSCF4542

DSCF4541

[★]
DSCF4523

 [★]
DSCF4509

 [★]
DSCF4508

[★]
DSCF4500

DSCF4499

 
DSCF4490

[★]
DSCF4483

DSCF4480

 
DSCF4469

[★]
DSCF4464

 [★]
DSCF4459

[★]
DSCF4445

[★]
DSCF4436

[★]

DSCF4433

DSCF4432

DSCF4426

[★]
DSCF4413

[★]

DSCF4412

[★]
DSCF4408

[★]

DSCF4407

[★]

DSCF4399

[★]
DSCF4385

[★]
DSCF4384

DSCF4383

DSCF4382

DSCF4373

[★]

DSCF4343

[★]

DSCF4339

[★]

DSCF4337

[★]

DSCF4336

[★]

DSCF4328

[★]
DSCF4325

[★]

DSCF4324

[★]

DSCF4311

[★]
DSCF4310

[★]
DSCF4309

[★]

DSCF4308

[★]

DSCF4538

[★]

DSCF4537

DSCF4536

[★]

DSCF4444

[★]
DSCF4441

[★]

DSCF4406

[★]
DSCF4335

[★]

DSCF4280

[★]

DSCF4262

[★]

Belfast-20110909-00360

[★]

North Down-20120919-01542

[★]
DSCF4402

[★]
DSCF4392

[★]
DSCF4259

[★]

bark-2

[★]

bark

[★]

woman-walking2

[★]

woman-walking

[★]

white-flower

[★]
trees

[★]

Tree-bark

[★]

Street-Lamps-red

[★]

Street-Lamps-black-and-white

[★]

Street-Lamps

[★]

pink-flower

[★]

pigeon-2

pigeon

[★]
locked

guardian2

Flower

fish

[★]
Dark-and-Dank-Alley

[★]
corridor

children-play

[★]

bird

[★]
big-fish

[★]
Roof Top

[★]
Street

[★]
Titanic Memorial

[★]
Locked Door

Image and Data Visualisatiob

Image and Data Visualisatiob

[★]
Image and Data Visualisatiob

Image and Data Visualisatiob

[★]
Image and Data Visualisatiob

[★]
Image and Data Visualisatiob

Image and Data Visualisatiob

[★]
Image and Data Visualisatiob

Image and Data Visualisatiob

Image and Data Visualisatiob

[★]
Image and Data Visualisatiob

Image and Data Visualisatiob

Image and Data Visualisatiob

Image and Data Visualisatiob

Image and Data Visualisatiob

Image and Data Visualisatiob

Swan

Winter Scene

eurCraft

[★]

Micro Photography Project

These are my 12 finalized images for the Micro Photography project.

DSCF4406

Macro Photography Project

These are my finalized 12 images for the Macro Photography Project. 10336700_10201897796586709_7096025549970384347_n

Image and Data Visualisation: Inspiration

Crying angel statue.....I love this, must figure out which board it deserves to go on or make another for it.
Crying Angel by Pierre the Ill, image found on Pinterest. Rodin..#art #sculpture #statue
Rodin by Navema, image found on Pinterest. Jean-Jacques Pradier. (1792-1852), James (dit). Satyre et bacchante, 1834.    Paris, Musée du Louvre.
Jean-Jacques Pradier, (1792 – 1852), image found Pinterest.  image found adrialindquistblog.com art, I saw the angel in the marble and carved until I set him free. Michelangelo
Image found bellafaygarden.tumblr.com Riots in Kiev Riots in Kiev, image found on tumblr. Christmas ride Christmas ride, image found abuethe.deviantart.com Ferrara ::1 Ferrara ::1, image found miskerkey.deviantart.com Waiting for Better Days by Matthias Haker Waiting for Better Days by Matthias Haker.

Micro Photography

Microphotography is the extreme form of macrophotography, dedicated to the photography of small objects from life-size to modest enlargements of up to about 20. Using the daguerreotype process, John Benjamin Dancer was one of the first to produce microphotographs, in 1839. He achieved a reduction ratio of 160:1. cookoo wasp References found: http://www.ephotozine.com/article/microphotography-tips-and-information-23075

Macro Photography

Macro photography (or photomacrography or macrography, and sometimes macrophotography), is extreme close-up photography, usually of very small subjects, in which the size of the subject in the photograph is greater than life size (though macrophotography technically refers to the art of making very large photographs). By some definitions, a macro photograph is one in which the size of the subject on thenegative or image sensor is life size or greater. However in other uses it refers to a finished photograph of a subject at greater than life size. The ratio of the subject size on the film plane (or sensor plane) to the actual subject size is known as the reproduction ratio. A macro lens is classically a lens capable of reproduction ratios greater than 1:1, although it often refers to any lens with a large reproduction ratio, despite rarely exceeding 1:1.
References found on Google

Golden Ratio

golden ratio  A4, A3, A2, A1 paper sizes golden ratio Fibonacci Blocks and Fibonacci Spiral  http://www.banskt.com/blog/golden-ratio-in-logo-designs/ Golden Triangles - SKETCHES - BEAUTIFUL HOUSES. I'm really obsessed with this proportion. About the Golden Ratio: The Golden Ratio can be illustrated within special dimensions of Sprials, Triangles and Rectangles where the ratio of the length of the short side to the long side is .618, was noted by ancient Greek architects as the most visually pleasing rectangle and its dimensions were used to construct buildings such as the Parthenon. (reference found on  Pinterest) Golden Ratio in Photography. Eye Catching Photographs The “Golden Ratio” is naturally and aesthetically pleasing proportion which is popular in design and architecture amongst other fields.  The golden ratio works wonders in drawing the human eye into the composition. Composition In Portraiture | The Wonder Of Light Golden Ratio in Cinematography Taxi Driver and the golden ratio. Michael Chapman, director of photography Taxi Driver and the golden ratio. Michael Chapman, director of photography Taxi Driver and the golden ratio. Michael Chapman, director of photography Taxi Driver, Robert De Niro, 1976.

Image and Data Visualisation

8884293b7d921a77e8126e1ade600687

Interactive Multimedia Design page

Project One

The first project for this semester is a photographic one, we want you to present six images in each of the categories below, that is twelve images in total. However, for each of these images you should expect to take 10, 20, 30 or more photographs before you end up with something you are happy to submit for assessment. You should present all of your images in your Flickr account making sure your final six in each category are clearly labeled, you could perhaps use a separate set for the final selection. The two sections are:

Macro

Photograph a landscape, cityscape, seascape, etc taking on board the principles you have researched and learnt into consideration. You can expect to take a lot of images from which you should choose six of the best which will be presented in your Design Journal. All of your images should be uploaded to your Flickr account with a clear link from your Design Journal to the set. Consider the story behind the images, what are you trying to say to 
the viewer?

Micro

Photograph a series of small, individual items. These may relate to your Macro series to continue 
the sense of a narrative or they may run as a 
separate series. Consider how these items are photographed, retain a consistency in your approach. Follow the same guidelines as those for the Macro series.

Rule of Thirds

Golden Ratio — Compositional Rule For Eye Catching Photographs An Open-Ended Course in Photography: Advanced Composition and the Golden Ratio The Golden Rules of Photography. What is it that famous photographers do to make their images so pleasing to the eye? Find out if simple rules of geometry and symmetry can make you a better photographer.   Objective: In this experiment you will investigate the use of the Golden Ratio and the Rule of Thirds in the composition of famous photographs. Golden section / rule of thirds Golden Ratio and Rule of Thirds How to think about your image? A Mathematical Guide to Aesthetics.. Photography & The Golden Ratio
Video reference
Gratitude: Louie Schwartzberg at TEDxSF by TEDxTalks on Youtube

Illustration

Image & Data Visualisation: Lost In Books

Link to my Flickr Illustration Page: https://www.flickr.com/photos/115986378@N03/sets/72157642065041504/

Design a series of three book covers

To choose ONE genre from the list below and research the subject.

  • Horror
  • Romance
  • Crime & thrillers
  • Science Fiction & fantasy
  • Children’s classics

http://www.youtube.com/watch?v=ZPQ-8Kty8X4 http://www.youtube.com/watch?v=SKVcQnyEIT8 Children’s Books

Fantasy Books
Crime and Thrillers
Horror

Image & Data Visualisation: Realms of Fantasy

“Fantasy is escapist, and that is its glory. If a soldier is imprisioned by the enemy, don’t we consider it his duty to escape?. . .If we value the freedom of mind and soul, if we’re partisans of liberty, then it’s our plain duty to escape, and to take as many people with us as we can!” ― J.R.R. Tolkien “All children, except one, grow up.” ― J.M. Barrie, Peter Pan “A children’s story that can only be enjoyed by children is not a good children’s story in the slightest.” ― C.S. Lewis

Three Fantasy Books

  1. The Hobbit (or There and Back Again) J.R.R.Tolkien

If there is one thing I love it would be a good escapist story. The Hobbit, by J.R.R. Tolkien, published in 1937, is just that kind of story: Bilbo Baggins lives a quiet, peaceful life in his comfortable hole at Bag End. Bilbo lives in a hole because he is a hobbit—one of a race of small, plump people about half the size of humans, with furry toes and a great love of good food and drink. Bilbo is quite content at Bag End, near the bustling hobbit village of Hobbiton, but one day his comfort is shattered by the arrival of the old wizard Gandalf, who persuades Bilbo to set out on an adventure with a group of thirteen militant dwarves. The dwarves are embarking on a great quest to reclaim their treasure from the marauding dragon Smaug, and Bilbo is to act as their “burglar.”  An unlikely hero who is called upon to challenge the odds, against a ferocious fire-breathing dragon. What more could you want than that?

Understanding Tolkien and the Origins of Middle-Earth

2.   The Chronicles of Narnia: The Lion, The Witch and The Wardrobe, C.S. Lewis Another route into the realms of fantasy, is not knowing what you may find through a wardrobe. C.S. Lewis’ The Chronicles of Narnia: The Lion, The Witch and the Wardrobe, published in 1950, sees Lucy Pevensie take a trip through a magical wardrobe into the realm of Narnia: The Lion, the Witch, and the Wardrobe specifically focuses on gluttony. Edmund’s descent into the Witch’s service begins during his frantic consumption of the magic Turkish Delight. Since this is enchanted Turkish Delight, Edmund cannot be held accountable for his gluttony as if he were overindulging in ordinary candy. The real sin occurs when Edmund allows himself to fixate on the Turkish Delight long after he leaves the Witch. Edmund’s consumption of the Turkish Delight may also be a reference to the sin of Adam and Eve, when they ate from the Tree of Knowledge.  The battle of good and evil is fought in the magical world of Narnia, in the most enchanting fantasy novels ever written.

Understanding C.S. Lewis and the Origins of Narnia

3.   Peter Pan, J.M. Barrie Second star to the right and straight on ’til morning will take you to a world of mermaids, pirates, Red Indians, and all it takes is a little sprinkle of faith, trust and pixie dust. J.M. Barrie told the Lewelyn Davis boys – the original Lost Boys – lots of stories, and these tales are where Neverland and Peter Pan came from. He came up with the name ‘Peter Pan’ by putting together the name of one of the boys and the Greek god of nature and shepherds, Pan – a lively and very naughty god with the legs and horns of a goat who is, of course, forever young: Peter Pan, which was alternately titled “The Boy Who Would Not Grow Up,” was first performed in London, England, on December 27, 1904, at the Duke of York Theatre. It has since become one of the most widely performed and adapted children’s stories in the world. It is also Barrie’s best-known work, though he was a prolific author writing in a number of genres. Critics believe that one reason Peter Pan was successful from the first is that Barrie combined fantasy and adventure in a way not done before. The play offers a fresh means of storytelling that appeals to both adults and children. While children enjoy the imaginative story and flights of fancy, adults can relate to Peter Pan’s desire to forego mature responsibilities and live in the moment. What the story Peter Pan describes is death; our fears of death and our wishes to overcome death to be immortal; however, it is also a fantastic escapist story about living in the moment, faith and trust.

Understanding J.M. Barrie and the Origin of Peter Pan

Fantasy (and its meaning)

There were quite a few ranges of books that I had thought about; I made a list of six possible books, and tried a few rough ideas to start off. Though, each book on my list was very good and this left me torn between which to choose; I struggled to reach this final conclusion that is listed above. My reason for this selection is simple; I love good escapist fantasy stories with heart, bravery and meaning; a good fantasy story, for me, has to have a strong connection to real life, but, living outside the boundaries of realities rules. Ultimately I think of fantasy stories as intriguing fun. Fantasy to me always asks the question, “what if ?”(or “let’s pretend”). It is also the dreaming of a better place; and what it does is, it tries to find meaning and explain human beliefs/ life. Fantasy is a genre of fiction that commonly uses magic and other supernatural phenomena as a primary plot element, theme or setting. The identifying traits of fantasy are the inclusion of fantastic elements in a self-coherent (internally consistent) setting, where inspiration from mythology and folklore remains a consistent theme. Within such a structure, any location of the fantastical element is possible: it may be hidden in, or leak into the apparently real world setting, it may draw the characters into a world with such elements, or it may occur entirely in a fantasy world setting, where such elements are part of the world. Essentially, fantasy follows rules of its own making, allowing magic and other fantastic devices to be used and still be internally cohesive.

Middle-Earth’s Secrets: Tolkien’s Lord of the Rings

Image and Data Visualisation: Illustrators

August Hall

Charles Vess

Raoul Vitale

Matt Gaser

Scott Gustafson

Greg Couch

Omar Rayyan

 

Michael W.M. Kaluta

Donato Giancola

Tony Diterlizzi

Marc Fishman

Image & Data Visualisation: Finalized Book Cover Designs

the hobbit book cover the lion the witch and the wardobe bookcover2  peterpanbookcover
These are my three finalized book cover designs. My genre was Fantasy, I decided I wanted to aim my book designs for children of ten to twelve; so, I therefore settled for a simple/subtle cover design. Colour was to be the main interest of the book, I also had in mind that I wanted to design a book cover that I would buy myself if I saw it on a book shelf.

Inspirations

There were a range of inspirations that led me to focus on these designs. Peter Pan Inspirations

peterpan,art,graphicdesign,illustration,poster,theater-063392e075dd7445ca1117b9613e2da0_h PeterPan-Amazon-small

(Image left found: tuesdaymourning)  right: Google Search Peter Pan Illustrations AGJ153150 il_fullxfull.372403037_6q5k

Anne Grahame Johnstone and adamtrest

daisy-fairy-illustration-from-peter-pan-in-kensington-gardens-by-j-m-barrie-published-1912-by-arthur-rackham

Arthur Rackham fairy The Lion, The Witch and the Wardrobe Inspirations slide1 tumblr_melpatGpx61qcexzdo1_500

Kevin Howdeshell

68941139_The_snow_queen___Shadow_Puppet_by_IsabellasArt 2_the lion witch wardrobe copy

(Above) Isabella Art – DeviantART  and M.S. Corley Illustration and Design 1129365364 0bcd1a3fe6ba048440fb717c6dd9f01f

Random silhouette art found on Google. The Hobbit Inspirations The-Two-Towers-Book-Cover-by-JRR-Tolkien_1-480 three_the_hobbit_posters_book_covers_by_emir0-d5ohsf7

J.R.R.Tolkien Illustration Cover  and  emir0

The-Hobbit-Alternative-Movie-Posters-3 TheHobbit_FirstEdition LOTR9 ibvcLnSZT5mVcN

HarperCollins Publisher’s Collection 2011

Celeborn_the_Lord_hobbit Yggdrasil____The_World_Tree__by_Due

Originals Book Inspirations Even though I was very inspired by these original inspirations, I had a change of style; I thought the cover of a book has to be something appealing, decorative and illustrate an aspect of what the book is all about. To have Illustrated that in these styles below would have not interested me in the slightest; for me, I prefer the simpler book cover; if there are illustrations depicting a scene, I feel they would be better off inside the book than on the cover. I feel having an illustration outside the cover depicting a scene in the book,  is really like a spoiler alert. I prefer book covers that hint at something about the book, that intrigues the reader, and sparks their imagination. Peter-Pan-Angry-Tink lecain_450 a0257633_1244247 378586 e3859be7470fc853656071d0194f30c0_large

 Data Visualisation

Image and Data Visualisation: Visual Narratives

Link to my Flickr Data Visualisation Page: https://www.flickr.com/photos/115986378@N03/sets/72157643323376063/ Flickr Data Visualisation Page 2: https://www.flickr.com/photos/115986378@N03/sets/72157644169458092/ Flickr Data Visualisation Page 3: https://www.flickr.com/photos/115986378@N03/sets/72157643323349944/

Will Eisner – “The story form is a vechical for conveying information in an easily absorbed manner”.

Links

Jonathan Corum

Jonathan Corum is the science graphics editor at The New York Times and founder of 13pt, an information design studio. He strives for the clear, simple presentation of complex information, with an emphasis on crisp and elegant visual explanations. He has designed more than 1,000 graphics for the Times, which have won 16 awards from the Society for News Design and 8 medals from the international Malofiej competition, including Best in Show. In 2009 the Times graphics desk received a National Design Award for communication design. Previously, he was a senior designer at Font Bureau and Interactive Bureau, and design director at Online Retail Partners. He graduated from Yale College with a degree in Art and East Asian Studies. (Info found: 13pt) 130305a 130305b 130305b

What Is Higgs?

(Link: Chasing the Higgs Boson by Nigel Holmes)

So What is Higgs Boson?

Storytelling With Data

Comic Strips

Daniel Merlin Goodbrey

(Info Found: E-mel hypercomics) My name is Daniel Merlin Goodbrey and everything you see here is my fault. I’m a comic creator and new media lecturer based out of Welwyn Garden City, England. E-merl.com is where I catalogue my experiments in fiction and the comics form. If that all sounds a little dry, don’t worry – I’m sure something horribly violent and amusing will happen if you stick around long enough.

Image and Data Visualisation: What is Art Direction?

“A principle of identity between content and expression.”  – Jan Tschichold

Link: NoisyDecentGraphics. tyepad.com (Written by Ben Terrett, a designer in London.)

Endless Possibilities of Art Direction

http://www.youtube.com/watch?v=cObeFvQvKSQ

Leonardo Da Vinci

(Reference taken from Zollner, F., 2010. Leonardo. Los Angeles: Taschen) Remarkable, extraordinary, almost always favourable – that is the picture of Leonardo Da Vinci handed down by the writers and critics of the past. They describe a multi-talented, endeavouring, attractive young man, who not only astonished his contemporaries as a visual artist, but was equally impressive as a scientist and a musician. While it was widely known that he also had other characteristics  which might have caused concern in those days. But while he was spending time on his researches in areas that are no more than passing interest to art, his inconstancy and unreliability meant that he finished very few of his works; his talent strove so strongly for perfection and he was so demanding of himself, that he started numerous things but then cast them aside again. The Vitruvian Man, 1485 A page showing Leonardo’s study of a foetus in the womb, 1510 Da Vinci’s sketches of muscles and skeletons, 1452 – 1519

William Morris

(Reference taken from Zaczek. I., 2001. Essential William Morris. UK: Parragon Publishing) William Morris was a man of many talents, whose life, and life’s work, made a huge impact on the worlds of literature, design and politics. His many ambitions and achievements expressed a profound commitment and belief in an active creative life for all. Morris experimented with every lecture and poetry. He established the famous design company, Morris and Co., where he enlarged upon the skills he had acquired as an architect to embrace the arts of stained glass, embroidery, wallpaper and furniture design and tapestry. The Brothers Grimm (1857) He made a number of other, sporadic attempts in the field. There is, for example, this single-page specimen, which features part of a story by the Grimm Brothers (The Iron Man). It dates back to 1857, when the artist was just 23 years old, and clearly betrays the influence of his recent student days. The Sleeping Beauty Tile Panel (1862-65) During the 1860s, Morris, Marshall, Faulkner & Co. produced three celebrated tile panels based on well-known fairy tales. These were Cinderella (1862-63), Sleeping Beauty (1863) and Beauty and the Beast (1863). The narrative scenes were designed by Burne-Jones, while the decorative border was fashioned by Morris. The boarder includes a marvellous series of stylised swans. Both Beauty and Cinderella are signed by Lucy Faulkner, and it  is highly probable that she was also responsible for painting this series. It was after this, Morris embarked on four large pictures know as the Briar Rose Series (1884-90).

Andy Warhol

(Reference taken from 2009. Andy Warhol “Giant” Size. London: Phaidon) ANDY WARHOL THE DREAMS THAT STUFF IS MADE OF by Dave Hickey In 1963, Andy Warhol transformed the artist’s studio from a “lonely garret” into a collective, corporate endeavor.He called it the Factory. Sometimes, on Saturdays, the Warhola family would go to the movies, where, unlike his brothers, Andy favoured the films of Shirley Temple – especially the ones in which the spunky little Shirley, armed with nothing more than charm and talent, guts and gumption, valiantly rescues her parents from penury and danger, in which the factory girl ends up owning the factory or the vaudeville kid, born in a trunk, becomes a star. Ultimately, Andy Warhol would do everything that he saw Shirley Temple doing on screen, except for the singing and dancing. He would become a star, own a factory, and rescue his mother from the penury of working-class Pittsburgh. He would do these things by catholicizing the funny papers he poured over as a child, by translating images of American popular culture into the language of the Byzantine icons. “Crazy Golden Slippers” article in Life, 21 January, 1957

“I loved working when I worked at commercial art and the told you what to do and how to do it and all you had to do was correct it and they’d say yes or no.”

Beauty Box: What’s In It For you, Harper’s Bazaar Kay McDowel 1957

“I like boring things.”

Advertisement For Bell System Telephone Service 1928 Marilyn Lips 1962

Roy Lichenstein

(Reference taken from 2011. Art. UK: Parragon Lichtenstein preferred to seek out his subjects in popular mass media like comics, from which he transformed motifs from trivial to the monumental. In doing so, he used the traditional comic-book technique of Matrix dots, which he applied with stencils. Crying Girl, 1964 We Rose Up Slowly, 1964 WHAAM!, 1963

Image and Date Visualisation: The Principles and Processes of Interactive Design, Jamie Steane

Steane, J., 2014. The Principles and Processes of Interactive Design. London: Bloomsbury

Industry Perspective: Campbell Orme, Moving Brands

links:

Client Hitachi Brief to design the user-facing experience of new innovative interactive software, which allowed for remote collaboration, using a protagonist, gesture-based interface. Agency Moving Brands Solution Moving Brands created detailed user journeys, logic flows, user interaction guidelines and a full user interface, for implementation and build by Hitachi Tokyo-based development team. Interview with Campbell Orme, Design Director, Moving Brands Campbell has worked in design and direction roles for a number of international design agencies including Moving Brands, Imagination, BERG, and Pentagram. Campbell’s specialism is interactive installations, software applications and custom hardware-specific software. After your initial briefing, how did you set about structuring the whole project? There were a number of clear phrases in the project, which spanned: requirements gathering, feasibility, information architecture, use flows, user experience (UX) and user interface design (UI). Can you describe the ‘requirements gathering’ phase? Some of the criteria that we look to summarize here are: ‘How do we succinctly describe the perceived outcome?’; ‘What is its purpose and who is it for?’ This last question is especially important as it’s one of the means of validation that we use for ascertaining whether the brief has been met. What research methods did you use to achieve this? Alongside current trend and market analysis, we worked with our client to get under the skin of what were deemed to be the core features of the software. Equally, as the end product was going to be targeted to a specific audience type – corporate, education and civic environments – we looked at what parallel user-case scenarios, away from technology were relevant. Could you explain the ‘feasibility’ phase? What we needed to know from the outset was whether our proposals were technically achievable, for fear of winding up with a design that couldn’t be realized. As there were third-party technologies being employed for some of the messaging and network feature – each with their own API nuances – we had to be aware of how these functioned. What happened next?  The next stage looks at the information architecture: the overall structure of the software. This often uses user journeys and slows, to ensure the given steps within a task are efficient and clear. This in turn leads into UX – page layouts and frames – and then eventually overlap, as we find issues that require us to revisit earlier phases. What this all means is that the fidelity and definition of the end product is continually being refined as the project progresses. What form do user journeys take? These are often a combination of paper prototypes, video demonstrations, or clickable interactives. These all have their individual strengths; for example, we find clickable demos are very useful for website wireframes, where we deliberately package up something that looks very rough to give the client a sense of walking through the end product without them fixating on its aesthetic appearance. What is the purpose of video prototypes? It depends on who they’re for. For the development team, they might be rough -and-ready stories to discuss how to navigate the product – to demonstrate a sequence that’s hard to convey on paper. for the client’s CEO, it may have to look very real, with a level of polish or realism that serves to get top level buy-in for the project. You’re developing a new product, so was it important to use familiar visual metaphors for the user interface?  As designers and developers, it’s preferable to lean on metaphors and tropes that are familiar to both end users and us. However, we quickly found that some of these weren’t applicable for this project. Designing a gesture based interface for a six-feet-wide screen presents new design problems, as, for example, people’s height and size come into play. You can’t automatically decide on a menu on the left or right of the screen without acknowledging a left-handed or right-handed bias. How do you visually research a project?  One of the first things we do is try and understand the client’s visual tone of voice. How do they represent themselves in the real world? Next, we have to access whether what we are doing has to sit alongside it, or has to work completely within it, or indeed has to be distinct. What visual methods of research do you use? We still use moodboards however they manifest themselves, and we often create mood films with sound and moving image that try to reflect the client’s tone of voice. They are not a means to an end in themselves, but they are effective for setting a project’s tone at an early stage, in a format that is self-presenting and easily shared. Did you undertake a formal user-testing? On occasion, we might engage a third-party user-testing company to organize formal assessments and focus groups within our target audience, but for confidentiality reasons this was less viable with this project. However, we did a lot of user-testing with the client’s development partner – the teams at Moving Brands and Hitachi’s team in Japan – and with people in our studio not directly involved with the project.

Image and Date Visualisation: Using Colour Systems

(Reference taken from: Steane, J. 2014, The Principles & Process of Interactive Design. London, Bloomsbury) Colour can both harmonize and organize graphic elements and information. Using colours based on a working knowledge of the colour wheel will provide your design with balance, harmony and organization. The basic colour schemes are explained below. Monochromatic schemes are created by taking a single colour and adding neutral colours to create shades. Monochromatic schemes are harmonious and easy on the eye, but are weaker at highlighting areas of interest. Analogous schemes are harmonious in the same way as monochromatic, but they have the benefit of being to accent the highlight areas of interest. Complementary schemes use pairs of colour that are opposite each other in the colour wheel. they are good for highlighting features, and work best when one colour is more dominant than the other where the less dominant colour is used as the accent colour. Split complementary schemes are made from three colours. Choose a colour then select colours from either side of its natural complementary colour. Split commentary schemes create impact, but are often hard to balance. Triadic schemes are created by choosing three colours complementary, triadic schemes are dynamic, but difficult to balance, and often work best when one colour is dominant. Adjacent Colours Although colour values can be set, their appearance will change depending on their surroundings, in particular adjacent colours. In general, colours appear brighter on dark backgrounds and are more muted when placed next to a colour of a similar hue. Colour Scheme Creation  In Adobe Illustrator, you can use the ‘Colour Guide’ panel (accessible from the Window menu) to help you find colour schemes based on you current fill colour. Alternatively, use online resources to find or create colour schemes:

Colour Scheme Designer Kuler Adobe Pictaculous Colour Guide Adobe Illustrator

The Tommy Portfolio Site

Image and Data Visulaisation: Fundamentals of Digital Typography

(Reference taken from: Steane, J. 2014, The Principles & Process of Interactive Design. London, Bloomsbury) To understand and appreciate the application of typography, it is essential to first become familiar with the basic characteristics and features of letterforms. Through their understanding, you can diagnose issues with a particular typeface and communicate what characteristics you are looking for when discussing typeface selection with fellow designers. Two important terms to begin with are ‘typeface’ and ‘font’. These common terms are not strictly interchangeable and have different meanings. A typeface is a set of one or more fonts that share a stylistic unity and form part of a type family. A font is a single character set of a particular typeface and size. Letters, numbers and other symbols that make up a character set are individually known as ‘glyphs’. Measuring Type Type size is traditionally measured in points (pt), with 72 points equivalent to an inch (2.54 cm). For screen-based design, type is increasingly measured in pixels (px) and in ‘ems’. Although a point is a fixed measurement, two fonts can appear to be of different proportions when they share the same point size. This is due to differences in fonts’ relative ‘x’ heights and widths. Type size is measured from the lowest descender of a font’s letterforms to just above the highest ascender, and a font’s x-height is measured from its baseline to the height of the lower-case x. Therefore, those fonts with short ascenders and descenders, or tall x-height, will appear relatively larger than others. Similarly, fonts with less height variation between its upper-case and lower-case letters will also appear larger. The width of letterforms will also affect a font’s relative size. A font’s point size relates to its height only and not its width, so condensed fonts will visually appear smaller than those with broader widths. The width of a font is normally expressed in character per pica and this measurement is used to estimate how much text will fit into an allotted space. An Anatomy of Type Type Measuring X-Height Old Style, Transitional and Modern Stresses Ligatures Kerning, Leading and Tracking
Stress The Stress refers to the angle of the thin stroke in rounded letterforms. Historically, ‘old style’ serif typefaces, such as Caslon, have inclined or ‘oblique’ stresses whereas ‘modern’ serifs, such as Bodoni, have vertical. Typefaces of the ‘transitional’ period have semi-oblique stresses, for example, Baskerville. Ligatures A ligature is the joining of two or more characters to create a single glyph. Ligatures have their origins in ancient manuscripts and were designed to stop letter shapes colliding. he most prominent ligature is the joining of ‘f’ and ‘i’ to make ‘fi’. Letter Spacing – Tracking and Kerning Letter spacing is measured in ems. An em is a relative measurement and is traditionally based on the width of the widest capital letter of an alphabet, namely the letter ‘M’. General letter spacing is known as ‘tracking’ whereas individual spacing between two letters is called ‘kerning’. Note: an em is now commonly used to describe the relative height of letterforms too, where 1 em = the point size of the font. Leading The spacing between lines of type is known as ‘leading’. This historical term comes from the days of movable metal type when different thickness of lead were placed between lines of type to aid readability. Leading of lead is expressed in points, too. For example, 10/12pt is 10pt type on 12pt leading. Styles and weights Versatile typefaces come in a series of styles known as ‘weights’. For example, the Neue Helvetica typeface family show not only the standard regular, bold and italic, but also a whole range of different stroke weights. In the past 25 years, we have also seen the growth of ‘super families’, which include Serif, Sans Serif and Slab Officina and Thesis. These super families are designed to work harmoniously together and give a visual consistency to a design across a variety of uses. Serif Roman inscriptions inspired serif typefaces. The term ‘serif’ describes the angular details at the ends of letter strokes. Old-style serifs date back to the fifteenth century and serifs today are associated with traditional book and newspaper publishing. Sans Serif Sans Serifs are ‘Grotesks’ came into prominence at the end of the eighteenth century, partly as an aesthetic reaction to the over ornamentation of serifs and, more practically, as a need for typefaces with greater legibility. Sans Serifs are commonly used for signage and information graphics, and work well on screen. Slab Serif Slab Serifs are characterized by thick block-like serifs. they first came into use at the beginning of the nineteenth authoritative nature. For this reason, heavy slab serifs are used sparingly as they are uncomfortable to read for more than a few lines of continuous reading.

Image and Data Visualisation: Death Penalty

Project 03 Data Visualisation

For this final project we are to convert a set of statistics from the link below into something that can be easily understood by as wide an audience as possible. Global Death Penalty Statistics A few contemporary visualisations worth checking out are:

References:

_63125925_data data visualisationhai-data-visualization infographic1   I took many elements from these designs as my influence for my final design, through the layout. I was very much impacted with how everything was organised on these charts; that they became the basis for my inspiration and ideas. For my designs I wanted to achieve these to the best of my ability.   My Graph Charts In the earliest stages of this project I was confused as to what information on the stats from the webpage we were to put into a graph. I soon found out that it was only the totals section. I used Microsoft Excel for these charts.   Death Penalty Chart deathpenalty chartdeathpenaltybarchart DeathpenaltychartDeathpenaltylinechart   Final charts chart chart2

Going back over my charts these were the two that I used for the final design of my infograph. I traced over them and gave them a different colour code. Early Design Attempts

death penalty chart design2 death penalty chart design3death penalty chart design4

These were my early attempts; I decided to go with my final version because I feel that it give the most information and had a better design quality/layout that I liked.

IDEA 1

death penalty chart design

I really liked this final design, as it could progress into a web page; my goal for this project was to try and get a infograph that could be developed as a webpage.

Book References

 Data Flow

Data Flow Photocopies_Page_01Data Flow Photocopies_Page_02Data Flow Photocopies_Page_03Data Flow Photocopies_Page_04Data Flow Photocopies_Page_05Data Flow Photocopies_Page_06Data Flow Photocopies_Page_09Data Flow Photocopies_Page_10Data Flow Photocopies_Page_11Data Flow Photocopies_Page_12Data Flow Photocopies_Page_14

Process of Interactive Design

Interactive design process Photocopies_Page_1 Interactive design process Photocopies_Page_2 Interactive design process Photocopies_Page_3 Interactive design process Photocopies_Page_4 Interactive design process Photocopies_Page_5

Some books on Data Visualisation that I found to research.

Image and Data Visualisation: Death Penalty Final Designs

I have decided to redo my original idea and to create a design that is best suited for a poster; advertising death penalty to inform the audience. I felt really black with this topic so my designs became black and dreary, as I think the topic seems to bring these emotions out of me. The first thing I decided to do was to find a font that a particular style that would impact and shock the audience, once you look at it; I wanted it to not over dominate the poster. So, by scaling the font size reasonably I think this will reduce its over dominance on the poster, but, the design of the font will still convey it impact. Font Styles
I began with this image above, taking the font design from Dafont and my Photoshop font column; I rearranged and recreated the style of the font to suit what I was wanting to capture in my design. What I would do is, I would begin by selecting each of these fonts and play around with the colour, scale and placement of the lettering. Here are a few of the fonts I selected from this list above, I have also given the name of the original font. Font Styles2 Font Styles3 Font Styles4
My inspiration for these fonts were from infographics that I have researched. Below are a few examples of some of the infographs I have looked at. I have also been influenced by the poster designs of Saul Bass, an American graphic designer and award-winning filmmaker. During his 40-year career Bass worked for some of Hollywood’s most prominent filmmakers, including Alfred HitchcockOtto PremingerBilly WilderStanley Kubrick and Martin Scorsese. Among his most famous title sequences are the animated paper cut-out of a heroin addict’s arm for Preminger’s The Man with the Golden Arm, the credits racing up and down what eventually becomes a high-angle shot of a skyscraper in Hitchcock’s North by Northwest, and the disjointed text that races together and apart in Psycho. Below are some of the earlier designs I have created for the infographic. I tried various different arrangements for the font and the images; I did not want things to overlap one another in a way that would make my design look messy, and not understandable. Death Penalty DO-OVER Death Penalty DO-OVER2 Death Penalty Poster 3 Death Penalty poster Death Penalty Poster2
Finally, these two images below are my final designs for this redo of my project. What I like about these is the title font, how everything plays well together and it is easy to understand; you don’t even need to read the information to understand that this poster informs about death.
Final Death Penalty Design Final Death Penalty Design2

Edward Tufte

I loaned two books by this artist called Visual Explanations: Images and Quantities, Evidence and Narrative and Second Edition – The Visual Display of Quantitative Information. My tutor had mentioned this artist in our tenth week; suggesting we get our hands on some of these books. They are very fascinating reads explaining Data graphics visually, by demonstrating the combined use of points, lines, a coordinate system, numbers, symbols, words, shading and colour.

The Visual Display of Quantitative Information2                The Visual Display of Quantitative Information The Visual Display of Quantitative Information1

The third image was partly my inspiration for my original idea for this project. Only with my project I knew I would have to create a better design; something that would advertise and interest my audience. While also having a similar idea as to inform them with facts about a particular topic.

Visual Explanations Visual Explanations1 Visual Explanations2 Visual Explanations3

I also found some very useful information on letterform; these images demonstrate the weight and height of a letter, the font style and go into further history about such letterforms as the Trajan Inscription. http://www.youtube.com/watch?v=w8Z6_0VS6Wc These two books also reference many of William Playfair’s graphs and charts; they are very structured drafts with a very interesting design. They are very appealing graphs to look at. William Playfair was a Scottish engineer and political economist, the founder of graphical methods of statistics. William Playfair invented four types of diagrams: in 1786 the line graph and bar chart of economic data, and in 1801 thepie chart and circle graph, used to show part-whole relations.

http://www.ted.com/talks/aaron_koblin

Aaron Koblin

http://www.youtube.com/watch?v=4v4XxlfVk3o

Aaron Koblin


Aaron Koblin is an artist and designer specializing in data and digital technologies.

Aaron’s work uses real-world and community generated data to reflect on cultural trends and the changing relationship between humans and the systems they create. His work is part of the permanent collection of the Museum of Modern Art (MoMA) in New York, the Victoria & Albert Museum (V&A) in London, and the Centre Pompidou in Paris. His projects have been shown at international festivals including TED, Sundance, Tribeca Film Festival, Ars Electronica, SIGGRAPH, OFFF, the Japan Media Arts Festival, and more. He received the National Science Foundation’s first place award for science visualization and two of his music video collaborations have been Grammy nominated. He received his MFA in Design|Media Arts from UCLA. In 2010 Aaron was the Abramowitz Artist in Residence at MIT and he leads the Data Arts Team in Google’s Creative Lab.

TED Talk Creators Project Future of Storytelling

(Info taken from: http://www.aaronkoblin.com/info.html) http://www.aaronkoblin.com/work/flightpatterns/

The Johnny Cash Project

http://www.thejohnnycashproject.com The Johnny Cash Project is an interesting interactive global project, in which anyone from any part of the world can take part in. Through the interactive website participants can draw their own portrait of Johnny Cash to be integrated into a collective whole. There is also a section that allows you to past a certain frames and see the art work, it also give credit to who painted the piece and their location in the world. You can even see the process of how the frames were painted.

The Wilderness Downtown

http://www.thewildernessdowntown.com This website allows browser to type in their home town and address, which it then creates a music video from. http://www.youtube.com/watch?v=npjTmG-TBHQ

 Infographic Final

I decided to create one more idea for the design of my infographic, this time taking only eight countries for both Executed and Sentence to Death results. I used people icons to represent the sentenced to death, and hangman’s nose to represent the executed.

The compass image was taken from GOOGLE on a website called http://forum.girlscene.nl/forum/beauty-health-hair/het-grote-tattoo-topic-104767.7350.html.

DeathPEN01

 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s