Justice Mitchell - Social Media Marketing Blog Professional

Friday

Jul302010

Augmented Reality, Spook Country & A Future Canvas For Fine Art

Friday, July 30, 2010 at 11:32AM |

As many of you know, I'm the product of two amazing artists: Morris Mitchell and Fran Schroeder. You could say that I was bred to be in the creative world. Both parents went to Ringling School (now College) of Art & Design as students, and subsequently taught as professors there. My father retired after forty-two years. So to say that I've seen an art show or two would be nothing short of an understatement. Most of that time was spent viewing (or as a kid, complaining about viewing) fine art. Having been taken to some of the worlds finest gallery's, countless retrospective and endless local openings. This is the stuff that many see, few internalize and fewer still can afford. With that being said, I've found a kinship with fine art. So much so that my wife still likes to tease me about the first time I walked into the Metropolitan's permanent collection of Van Gogh I began to cry – pussy.

Some of the things that I'm drawn to know are styles of fine art that are digitally motivated, kinetically motivated or environmentally motivated -- such as installation work. While it can be said for most of John Q. public, "I don't know art, but I know what I like," artists just need to except that people will adopt, motivate and ideally embrace work as they see fit. So it should come as no surprise that most fine artwork is typically never seen. Well, this may very well be the future of some digital art.

You hear me talk about books I'm reading and you think of me in a smoking jacket (and nothing more), maybe an ascot, a faithful hound, pipe, orange felt slippery bought off the coast of some small fishing village and a wall of contemporary prose. While I agree that is a fine thought, the fact is I'm mildly insane and can't keep focused for more than, say, five pages in a traditional book before I've drifted off into a sea of unrelated thoughts. However, I've found great success with audio books, of which I've read (listened to – whatever semantics! they still cost too much) countless times. With that being said, my most recent obsession has been that of William Gibson and his uncanny ability to prognosticate not just the possible future, but the alternative interpretation of the present day. With that being said, "Spook Country" has in it's pages the message of augmented reality as a canvas for artists to interpret. This marvelous vision has inspired me to think that not only is this a fantastic and realistic idea, but it's only a matter of time.

As an artist, I'm obsessively looking at this medium as the final frontier. Here, I can make the world around me look, feel and be anything I want it to be. But the devil on my shoulder is that of the professional advertiser that can see the same value in all that untapped canvas, prime for branding.

Realistically, all of this conversation is a few years away, but not like decades. Technology and, more importantly, adoption and usage of new technology is growing faster than at any point in the past. This is good and bad as only a half a dozen years ago, if you found a sound technology, you were more apt to keep and use it religiously. Not now, not ever. Technology from here on out is as disposable as trends. We'll begin to see technology as trendy. "OMG, can you believe he still uses "MySpace?" So with knowing that we're going to be a nation of the BBD (bigger, better, deal), augmented reality allows the playing field to be vastly different. True space does not care how you look at it, or with what app/visual-browser. Trend gone. The context will be how the space is used. Below, you will find an amazing TED presentation regarding replacing advertising with art within the augmented reality space. The same can be said be said for ideas like physical storytelling and artwork --actually allowing your environment to be interpreted within the vision of artists, advertisers, storytellers and simulations. And this is not falling on the shoulders of oversized helmets and wire-strung glasses that will need to be warn constantly. This will be mobile, casual and interpretive from one user to another.

When I use the word infancy, I do so saying that this platform has endless growth possibilities and has not even scratched the surface of its potential.

Currently available dominant augmented reality browsers for your primary smart-phones:
• Acrossair
• Layar
• Wikitude

Augmented Reality Gaming:
• Sekai Camera
• GraffitiGeo

Collection of related links on Augmented Reality as it pertains to its use by artists:

http://www.laboralcentrodearte.org/ (See English version within the navigation)
Clara Boj and Diego Diaz (Murcia, 1975) combine their artistic activity in solitaire with projects in collaboration since year 2000. Its work is mainly centered in the observation of the public space and the diverse transformations (architectonic, technological, functional, social, …) resultants of the incorporation of the new technologies to the space of the routine character, from which they generate facilities that combine physical and virtual qualities to try to generate bows of continuity between the old ones and the new forms of social relation, between old and the new spaces of communication.
The Artvertiser is an urban, hand-held Augmented Reality Improved Reality project that re-purposes street advertisements as a surface for exhibiting art.

Julian Oliver - TEDxRotterdam 2010 from TEDxRotterdam on Vimeo.

Continued:

Article: Artists experiment with augmented reality
Article: 2010: The Year of Augmented Reality?
Article: Augmented Reality, RFID and Dead Media
James Alliban - AR Blogger
Advanced Interactive Media
Augmented.Org
AR Education/Games
Some of my Delicious links

Art,

Storytelling,

Technology,

Tools,

Trends |

Wednesday

Apr282010

My Name Is Justice & I'm Addicted To Fonts

Wednesday, April 28, 2010 at 8:52AM |

Courtesy of FranSchroeder.comMy love for fonts goes back to my childhood when my mother would hand letter everything. She still does when she's not on the computer Skyping friends in the UK or designing spots for the local paper. She even has a degree in 'Sign Making', which admittedly is almost entirely a thing of the past now having been rolled over by vinyl cutting machines and printers that are capable of printing to outdoor canvas. But there is a beautiful truth in the hand-painted letter that I still tip my hat too.

Here's to you "BONELESS CHICKEN ON SALE!" on the grocery store window.

Here's to you "SPRINGSATIONAL BLOW OUT!" car sale.

Here's to you "Orange County Fire Fighters, Station 18" - in golf leaf no less ;)

Here's to you Rock-A-Billy pinstriping dude!

All that being said I began and continue my obsession with fonts, signage & lettering. I hope the following lists comes as a blessed resource to you and your future designs. I've tried to weed this like of online font sites that just loop you from one to another only then to sell you porn and real estate along the way. If you find on here, tell me, I'll kill it.

Smashing Magazine Articles:

Smashing Font Article

Font Portals:

Font Blogs:

Designers & Foundries (Courtesy of FontShop.com):

Font Styles:

Grunge Fonts:

Graffiti Fonts:

Font Creators/Software:

Font Lab:

Web Ready:

Logos:

Font Tools:

Fun Tools:

Art,

Design,

Tools |

Sunday

Jan242010

Neo-Immersion Video

Sunday, January 24, 2010 at 1:19PM |

I guess it should come as no surprise to me that 360º video technology would finally catch-up. With Google's "Street View" technology and pushing 360 images with higher and higher pixel ratios it was only a matter of time. But this morning when I was linked to Immersive Media's user guided panoramics of the devastation in Haiti it took the medium to a whole new level for me. It felt like a video game at first until I relies just how much more captivating it became for me as I controlled the POV.

I'm not quite sure how this technology will play out, but I'm sure this company and others will be pushing the boundaries of what it can do. I could see it replacing or enhancing the street view style mapping. I think this going to be a mandatory no-brainer for news channels trying to one up the competition; and sadly I'm sure they'll be a thousand military applications.

I could also see it being the next way we make travel choices. And having shot a million hotel rooms, pools, restaurants and patio bars I can tell you that the travel and entertainment industry should keep and eye on this for the future of falling within the consideration set.

Interactive,

Technology,

Tools |

Thursday

Dec172009

Google Browser Size: A Cool Tool For The New School

Thursday, December 17, 2009 at 8:44AM |

Website designers, statisticians and advertisers alike should take a quick peek at the new Google Browser Size tool. It's nice as a quick reference tool to see where various parts of your website are falling at it comes to not simply usability, but user attention.

"This is useful for ensuring that important parts of a page's user interface are visible by a wide audience. On the example page that you see when you first visit this site, there is a "donate now" button which falls within the 80% contour, meaning that 20% of users cannot see this button when they first visit the page. 20% is a significant number; knowing this fact would encourage the designer to move the button much higher in the page so it can be seen without scrolling."

"How To Create An Informational Website Architecture" Thing

Friday, December 11, 2009 at 3:58PM |

How To Create An *Informational Website Architecture (IA)

There are those interactive shops that use IA's as a way price jobs. Some use this information to create wire-frame templates, page scenarios and test prototypes against. There are those who use IA's to figure out how the website will interrelate with complex database structures or legacy applications. There are those that use IA's to qualify and test their usability, informational flow and make assessments about the amount, location and type of content being used. And lastly, there are those who use IA's to simply sell and scope the work to the client. Naturally it's best to understand that they can be used in the "E - All of the above" category. Ergo – engage this post!

Wikipedia describes and IA as:
"Information architecture (IA) is the art of expressing a model or concept of information used in activities that require explicit details of complex systems. Among these activities are library systems, Content Management Systems, web development, user interactions, database development, programming, technical writing, enterprise architecture, and critical system software design. Information architecture has somewhat different meanings in these different branches of IS or IT architecture. Most definitions have common qualities: a structural design of shared environments, methods of organizing and labeling websites, intranets, and online communities, and ways of bringing the principles of design and architecture to the digital landscape."

With all that said the greay area here is MASSIVE of just what truly is an informational architecture. There are so many different types of architectural differentiations that it can get quite confusing.

Just as an example there are architectural documents on:

Business analyst
Enterprise architecture
Enterprise Information Security Architecture
Data architecture
Information design
Information system
Interaction design
Knowledge organization
Knowledge visualization
Process architecture
User experience design
Web indexing
Website architecture

We're going to be spending our time talking about Website Architectures. More specifically in today's interactive lexicon we call these documents 'informational design documents'. While you as the newbie or senior architect may not require all architectural documents in order to complete your website it's best to construct at least the primary foundation.

Informational design can be used for an amazing array of things including (but are not limited too):

A sales tool
To test a creative brief against
To inspire and direct a copyrighter
To inspire and direct a developer
To inspire and direct a designer
To use as a comparative measurement against competitor sites
To phase jobs and assess budget thresholds
To select and insure proper technology usage
To insure proper modularity of a website
To construct project scheduling against
Can be used in testing, quality assurance and usability efforts
A scope-creep device; change orders and client guide

Getting started:

First off (I'm going to assume you have a site that your working or intend to submit an RFP against) write down every page that is on the current website for overhaul.
Next, do you some in-depth due diligence on your competitors websites. Write down and construct a comparative matrix of pages/information you thinka re good, bad and or worthy of a consideration set to the next version of your web presence. Rank each item them 0 - 5. This does not give navigational priority, simply gives reference to compare against.
Now go to sites that you consider utilizing 'best practices' with your industries discipline. Example would be, you sell hand-made jewelry online; look at the best eCommerce websites such as Amazon.com, Ebay,com and others. What pages make the site functional and easy to use? What content makes the items enticing for purchase? Write down all the pages and site a small detail of their importance.

TIP: Often if you're comparing a boatload of sites you can jump to the bottom of the page and see if they have a site-map. A site-map is a page that lists all (or most) of the pages within their site and typically their navigational importance. Navigational priority will later become very helpful in how and what content goes where in your website.
What you should now be left with is a sea of page titles, details and a vague idea of where certain content will [might] go.
Next, start with the home page, or the page that will lead you into the area that your creating a flowchart for. It's safe to say that if your constructing a flowchart for a micro-site or new area of a larger site that there may not be a "home page" by definition. Now slowly sift through all the content you think should go on the site and its priority and start a hierarchical structure. Each column under the main (home) page will be a "sub home" page, and all pages below will become simply "sub" pages. You can delta your material even further into 'subsets,' but it's not recommended as your will be increasing difficulty on the usability and therefore making assumptions on your audiences technical proficiency. The "K.I.S.S." (Keep It Simple Stupid) should be your mantra.

A basic Website list [might] go something like:

ACME CO. Home Page
Newsletter signup
RSS Feeds
Social Media Links
Rotating Product Line
Specials (Call-Out)
Submit Your Photos!
Follow Us on Twitter
"Latest News" - blog post
Sub Navigation Items (example: ACME CO., PRODUCTS, SERVICES, NEWS & EVENTS, SPECIALS, CONTACT)
Footer Navigation Items (example: SITEMAP, LEGAL, ADVERTISE, WHOLESALE, CONTACT)

You can see in just this quick example that you're starting to crowd up a single page in a hurry. This is why defining your architecture is so important.

From the Top Down & The Left to Right:

There are two typical styles of IA. One is horizontal flowchart (recommended) that shows hierarchal importance from top to bottom, and left to right.

The second is a horizontal IA that has the home page on the left and then delta's out to the left, putting the hierarchal importance to the top. Either style is fine, but I seem to have the most success explaining sites to clients with the first version.

Define your architecture:
Defining your document with top line mandatories such as:

Client & Project Name
Date
IA Version (this convention should change every time the IA changes, so it's your third revision it should be labeled v3. or v1.3 dependent upon complexity and differentiation from the previous)
Comments (given that the client, or your team internally had made comments, note them here

Create a key:

A key is like an map key, it's a set of iconography that allows for you to give detail to an area with just a small succinct image.

Here are a few that I use on my own to detail various parts of the overall structure:

Downloadable Files – This would be a page(s) that might contain a series of PDF or other documents you want available for download.
Registration Page – This would symbolize a page that would require or have a registration component to it.
Auto-Rotating Functionality – An image(s) that would rotate through or be randomly generated upon reload.
Multiple Pages – This one is key, it's used to notify that there are more than likely many pages within the given section your outlining.
Secure Pages – Page(s) requiring password protection.

Please see the attached PDF (below) for a larger list.

Define server technology and analytics:
If you're a shop that is specific to a development language, server technology, analytics package or proprietary application please be sure to note it somewhere in the IA for your own protection.

Legal:
Somewhere begin the overly tedious process of protecting your ass with some legal verbiage that says, that this is a copyright protected document and that should you make changes to it after the final approved version that it will be 'client notified.' There's tons of free legal/contractual resources for you on the internet – see my Delicious links for more.

Last couple of thoughts as you embark out on your new education:

Red flags to be mindful of:

No one wants to click more than four deep for their selected content (Home/Sub/Sub-sub/detail)
Users hate to wait
User don't want to be forced into a linear digestion of information
Don't break the navigational pattern(s)
Users hate to hunt (UNLESS it's part of the conceptual experience)
There's no such thing as a "Back" button anymore
Users interest level [usually] goes like this:
Home page - I want it now, I want it brief and I want it concise
What out for long sub-navigational strings; if you can try to break up isolated areas of heavy content

*I'm not claiming that any of this information is fact or legally bulletproof, it's worked for me for 15 years, but USE AT YOUR OWN RISK you ungrateful bitches.

Additional Resources:
http://www.adobe.com/products/illustrator/ - For the most visual control, by creating your own 'system' utilizing Adobe Illustrator
http://www.omnigroup.com/applications/OmniGraffle/ - Another great application (with flowchart capabilites) for a MAC
http://office.microsoft.com/en-us/visio - The super hardcore informational development tool for PC (please note this is not a user friendly application)
http://flowchart.com/ - online flowchart software
http://www.gliffy.com/ - online diagram software
http://writemaps.com/ - online site-map software

Great Educational Overiew of the flowchart process:
http://www.jjg.net/ia/visvocab/

Design,

Interactive,

Tools |