Skip navigation
Help

social media

warning: Creating default object from empty value in /var/www/vhosts/sayforward.com/subdomains/recorder/httpdocs/modules/taxonomy/taxonomy.pages.inc on line 33.

Dave Eggers, the acclaimed author behind A Heartbreaking Work of Staggering Genius and A Hologram for the King, will release his latest novel, The Circle, this fall. The book will revolve around a fictional, but eerily familiar entity, "the Circle," which is described as "the world's most powerful internet company."

The Circle, run out of a sprawling California campus, links users’ personal emails, social media, banking, and purchasing with their universal operating system, resulting in one online identity and a new age of civility and transparency.

0
Your rating: None

Mark Cuban has seen all types of aspiring entrepreneurs in the past five seasons of ABC's reality pitch show "Shark Tank." He's seen idea people, sales people, and numbers people. But the only thing that actually gets his attention, and keeps it, is hard work and measurable business results.

0
Your rating: None

The Ludum Dare jams are splendid occasions, bringing designers together in person and across the strands of this electronic web. Every event throws out at least a handful of games (I can reliably carry seven games in one hand) that are either brilliant proofs of concept or miniature masterpieces in their own right. Now that the voting results for the Ludum Dare 28 are in, I’ve been playing through the crop’s creamier portions. The league tables are sorted into categories – Overall, Innovation, Fun, Theme, Graphics, Audio, Humour and Mood – and I’ve included the winning entry in each. There is a well of free gaming goodness below.

A quick runthrough of the Ludum Dare rules first of all. Every

0
Your rating: None
Original author: 
Mikko Takkunen

Features and Essays

Rena Effendi / INSTITUTE  for National Geographic

Rena Effendi / National Geographic

Rena Effendi: Transylvania Hay Country (National Geographic)  The old art of making hay on the grass-growing meadows of Transylvania | from the July issue of National Geographic magazine | Effendi’s agency

Ami Vitale: Montana Ranch (Photo Booth)  A testament to a disappearing way of life and an ode to its endurance.

Rena Effendi: Spirit Lake (Institute) Located in an isolated and economically languishing area of North Dakota, Spirit Lake is a Sioux Indian reservation home to some 6,200 inhabitants

Raphaela Rosella: Teen Mothers in Australia (Feature Shoot)

Giorgos Moutafis

Giorgos Moutafis

Giorgos Moutafis: Istanbul’s Taksim Square (Photo Booth) Moutafis’s website

Guy Martin: Turmoil in Istanbul: Turkey’s Gezi Park Protests (LightBox) Full edit on Panos Pictures here

Guillaume Herbaut: Unrest in Turkey (Institute)

LouLou d’Aki: Occupy Istanbul: Portraits of Turkey’s Protest Kids (NY magazine)

Enri Canaj

Enri Canaj

Enri Canaj: City of Shadows (Foto8) Athens, Greece

Yannis Behrakis: Homelessness in Greece (Guardian) Related on Reuters photoblog here

Lauren Greenfield: The Fast and The Fashionable (ESPN) In Monaco during F1 Grand Prix

Giovanni Cocco: The Life Of A Sibling With Disability (NPR Picture Show)

Riverboom: Giro d’Italia (Institute)

Robert Nickelsberg: Surviving Cold War (World Policy) Forces from Norway, Britain, and the Netherlands in training in the planet’s harshest climate in the Arctic Circle

Diana Markosian

Diana Markosian

Diana Markosian: My Father, The Stranger (NYT) Markosian writes about her father here | Related on the NYT Lens blog here

Ian Willms: Following in the Mennonites’ Footsteps (LightBox)

Tomasz Lazar: In Kosovo, Bridging an Ethnic Divide (NYT)

Cathal McNaughton: Yarnbombers (Guardian) Photographer Cathal McNaughton has caught up with the Yarnbombers, the guerrilla knitters who plan to target the G8 using knitting or crochet rather than graffiti

Sebastian Liste / Reportage by Getty Images for TIME

Sebastian Liste / Reportage by Getty Images for TIME

Sebastian Liste: On the Inside: Venezuela’s Most Dangerous Prison (LightBox)

Pietro Paolini: Ecuador: Balance on the Zero (Terra Project)

Elizabeth Griffin and Amelia Coffaro: Capturing Life With Cancer At Age 28 (NPR Picture Show)

Lars Tunbjörk: Cremation: The New American Way of Death (LightBox)

Lucas Jackson: Tornado survivors of Moore (Reuters photo blog) multimedia

Andy Levin: Coney Island (NYT Lens)

Daniel Love: 200 Hours (Guardian)

Robert Herman: New York: A View of Inner Turmoil (NYT Lens)

Reed Young: The Ground Zero of Immigration: El Paso (LightBox)

Sara Lewkowicz: An unflinching look at domestic abuse (CNN photo blog)

Tony Fouhse: The Simple View of Ottawa (NYT Lens)

Justin Jin for the New York Times

Justin Jin for the New York Times

Justin Jin: A Chinese Push for Urbanization (NYT)

Sean Gallagher: Climate change on the Tibetan plateau (Guardian) audio slideshow

Nic Dunlop: On the frontlines of a ‘Brave New Burma’ (CNN photo blog)

Zohra Bensemra: Pakistan’s female Top Gun (Reuters)

Paolo Marchetti: The Stains of Kerala (LightBox)

Behrouz Mehri / AFP / Getty Images

Behrouz Mehri / AFP / Getty Images

Behrouz Mehri: Life in Tehran, glimpsed through the rear window (AFP Correspondent)

Tyler Hicks: A New Strategy on One Syrian Front (NYT)

Laurent Van der Stockt: On The Damascus Front Lines (Le Monde)

Jason Larkin: Suez – Egypt’s Lifeline (Panos Pictures)

Nyani Quarmyne: Bridging Approaches to Mental Illness in Sierra Leone (NYT Lens)

Jake Naughton: Education of Girls in Kibera (Feature Shoot)

David Guttenfelder: Last Song for Migrating Birds (NGM) Across the Mediterranean, millions are killed for food, profit, and cruel amusement.

Nick Cobbing: Follow the Creatures (Photographer’s website) Antarctica

Nelli Palomäki: Portraits of Children (LightBox)

Articles

AP Explore

AP Explore

The Burning Monk 50th anniversary (AP) Malcolm Wilde Browne was 30 years old when he arrived in Saigon on Nov. 7, 1961, as AP’s first permanent correspondent there. From the start, Browne was filing the kind of big stories that would win him the Pulitzer Prize for reporting in 1964. But today, he is primarily remembered for a photograph taken 50 years ago on June 11, 1963, depicting the dignified yet horrific death by fiery suicide of Buddhist monk Thich Quang Duc.

Malcolm Browne: The Story Behind The Burning Monk (LightBox)

Love struck: Photographs of JFK’s visit to Berlin 50 years ago reveal a nation instantly smitten (The Independent) Photographer Ulrich Mack accompanied Kennedy on the entire trip. The results, published this month as Kennedy in Berlin, have mostly never been seen before

Osman Orsal / Reuters

Osman Orsal / Reuters

Images of Protest in Istanbul: The Woman in Red (No Caption Needed)

Turkey’s “Lady in Red” and the Importance of Professional Photographers (NPPA)

The photo that encapsulates Turkey’s protests and the severe police crackdown (Washington Post)

‘Woman in red’ sprayed with teargas becomes symbol of Turkey protests (Guardian)

Photographer documents Istanbul ‘war zone’ in his own backyard on Facebook (NBC News photo blog)

Photographic Mood, on the Eve of Destruction (No Caption Needed)

Photographer Injured in Istanbul Protests (PDN)

Pixelating the reality? (Al Jazeera: Listening Post) Photography is a subjective medium, and how it is used will always depend on who is using it. | On Paul Hansen’s World Press Photo of the Year and post-processing in photojournalism in general

The Art of War – Ron Haviv (Viewpoint on Vimeo) A documentary from the public television of Greece, year 2013. Language: English | Greek Subtitles

Leading photojournalist captures the beating heart of a brutal world (Sydney Morning Herald) Forty years of covering atrocities has only reinforced James Nachtwey’s faith in humanity

Rita Leistner: Looking for Marshall McLuhan in Afghanistan (BagNewsNotes)

Profile of a Curatorial Master: Yolanda Cuomo (LightBox)

A Glance at the 2013 LOOK3 Photo Festival (LightBox)

Edouard Elias / Getty Images

Edouard Elias / Getty Images

Two journalists, including photographer Edouard Elias, abducted in Syria (BJP) According to Le Monde and BBC News, the two journalists, Didier François and Edouard Elias, were travelling to Aleppo in Syria when they were abducted by four armed men at a checkpoint 

Syrian teacher turned war photographer (CNN) Nour Kelze describes her transition from English teacher in Aleppo to war photographer in the middle of Syria’s conflict.

Frontline Freelance Register created to help freelance war reporters (BJP)

Margaret Bourke-White’s Damaged Negatives From a Classic Assignment (LIFE)

A Paean to Forbearance (the Rough Draft) (NYT) The origins behind James Agee’s 1941 book, “Let Us Now Praise Famous Men,” a literary description of abject poverty in the South, accompanied by Walker Evans photographs.

In pictures: Saul Leiter’s pioneering colour photography (BBC)

Ageing and creative decline in photography: a taboo subject (BJP)

The Woman in a Jim Crow Photo (NYT Lens)

Abigail Heyman, Feminist Photojournalist, Dies at 70 (NYT) Related

Denver photographer Steven Nickerson who shocked, awed, dead at 55 (Denver Post)

Bolivar Arellano’s Photos for El Diario-La Prensa (NYT Lens)

Nelson Mandela: a life in focus (Guardian) Pulitzer Prize-winning photographer Greg Marinovich reflects on a legend of our time

Eman Mohammed in the Gaza Strip (Denver Post Plog)

Robert Capa’s vintage prints on show (BBC) To mark what would have been the 100th birthday of photographer Robert Capa, the Atlas gallery in London is holding an exhibition of his work. It comprises a wide range of prints from his time in Spain during the Civil War through World War II, and ending with the Indo China conflict where he lost his life.

Uzbek migrant workers in Kazakhstan

Chloe Dewe Mathews

Chloe Dewe Mathews’s best photograph – Uzbek migrant workers (Guardian)

Featured photographer: Scout Tufankjian (Verve Photo)

Featured photographer: Carlo Gianferro (Verve Photo)

Featured photographer: Antonia Zennaro (Verve Photo)

Deutsche Börse photography prize 2013 won by Broomberg and Chanarin (Guardian)

American Girls: Photographs Offer Vision into American Girlhood (Daily Beast) Polish photographer Ilona Szwarc’s new exhibit captures 100 kids with their cult-classic toy, the American Girl doll.

Northern Ireland: 30 Years of Photography by Colin Graham – review (Guardian) This catalogue of recent Northern Irish photography shows a determination to leave the documentary style of the Troubles behind

After Lowry (FT magazine) Landscape photographer John Davies takes a series of pictures in the northwest of England inspired by the work of LS Lowry

Eric Maierson: This is what editing feels like (MediaStorm blog)

Yunghi Kim: Protecting Our Images (NPPA)

I Spy: Photographer who secretly snapped neighbors goes to court (Yahoo)

Beyonce Photoshopped Into Starvation for Latest Ad Campaign (PetaPixel)

Interviews and Talks

C-SPAN

C-SPAN

Rodrigo Abd and Javier Manzano (C-Span)

Carolyn Drake (cestandard) An interview with Carolyn Drake, author of Two Rivers

Paul Conroy (Amanpour) The deadliest country on earth for journalists | Conroy on Marie Colvin’s last assignment

Alex Webb (LA Times Framed)

Christopher Anderson (GUP magazine)

Stuart Franklin (Vice) There’s More to Stuart Franklin Than the Most Famous Photo of the 20th Century

Paula Bronstein / Getty Images

Paula Bronstein / Getty Images

Paula Bronstein (ABC Radio National Australia) Internationally acclaimed US photo journalist Paula Bronstein talks about bearing witness to human suffering through her photo essays.

John H. White (NPR Picture Show) Photo Staff Firings Won’t Shake Pulitzer Winner’s Focus

Joe McNally (NYT Lens) Photographing on Top of the World

David Guttenfelder (NGM) Photographer David Guttenfelder reflects upon why taking pictures of the slaughter of songbirds is like covering a war.

Alexandra Avakian / Contact Press Images

Alexandra Avakian / Contact Press Images

Jean-François Leroy (BJP) Visa pour l’Image organizer on the festival’s editorial line and the cost of covering war

Jean-François Leroy (BJP) Visa pour l’Image organizer on social media, the future of photojournalism and the need for greater cooperation

Marco Di Lauro (Image Deconstructed)

Evgenia Arbugaeva (Leica blog) Leica Oskar Barnack Award Winner 2013

Jenn Ackerman (PBS NewsHours) One Photographer’s Experience Documenting Mentally Ill Inmates

Richard Misrach (PDN Pulse) Misrach on Documentary vs. Art, the Complications of Portraiture, and Digital Photography

Daniel Etter / Redux

Daniel Etter / Redux

Daniel Etter (LightBox Tumblr)

Espen Rasmussen (Panos Social)

Michael Christopher Brown (Window magazine)

Terry O’Neill (WSJ) The photographer on starlets, the Stones and Sinatra

Ewen Spencer (Vice) The Soul of UK Garage, As Photographed by Ewen Spencer

Mikko Takkunen is an associate photo editor at TIME.com. Follow him on Twitter @photojournalism.

0
Your rating: None
Original author: 
Steph

[ By Steph in Gadgets & Geekery & Technology. ]

Hell is Other People Smartphone App 1

Social media was invented to bring people closer, but the more antisocial among us can use it in a different way: to avoid the people we know. ‘Hell is Other People‘ is an interactive smartphone app that will show you exactly where your friends are based on Foursquare check-ins, and provide ‘safe zones’ where you can hang out without fear of being recognized.

Hell is Other People Smartphone App 2

Using the GPS function on your phone and your contacts’ public check-ins or location updates on Facebook, Twitter, Foursquare and other social media, the app will show you yellow points on a map that indicate where your friends are. The green points represent ‘safe zones.’
Hell is Other People Smartphone App 3

Of course, the map only works if your friends are avid social media users, checking in to virtually every place they go, and you still run the risk of running into them when they’re in route. You also might be relegated to unexpected places in the city. But as creator Scott notes in the video, “It’s kind of nice that I’ve been pushed into parks.”

Share on Facebook [ By Steph in Gadgets & Geekery & Technology. ]

[ WebUrbanist | Archives | Galleries | Privacy | TOS ]

    

0
Your rating: None
Original author: 
Lars Kappert

  

We are talking and reading a lot about responsive Web design (RWD) these days, but very little attention is given to Web applications. Admittedly, RWD still has to be ironed out. But many of us believe it to be a strong concept, and it is here to stay. So, why don’t we extend this topic to HTML5-powered applications? Because responsive Web applications (RWAs) are both a huge opportunity and a big challenge, I wanted to dive in.

Building a RWA is more feasible than you might think. In this article, we will explore ideas and solutions. In the first part, we will set up some important concepts. We will build on these in the second part to actually develop a RWA, and then explore how scalable and portable this approach is.

Part 1: Becoming Responsible

Some Lessons Learned

It’s not easy to admit, but recently it has become more and more apparent that we don’t know many things about users of our websites. Varying screen sizes, device features and input mechanisms are pretty much RWD’s reasons for existence.

From the lessons we’ve learned so far, we mustn’t assume too much. For instance, a small screen is not necessarily a touch device. A mobile device could be over 1280 pixels wide. And a desktop could have a slow connection. We just don’t know. And that’s fine. This means we can focus on these things separately without making assumptions: that’s what responsiveness is all about.

Progressive Enhancement

The “JavaScript-enabled” debate is so ’90s. We need to optimize for accessibility and indexability (i.e. SEO) anyway. Claiming that JavaScript is required for Web apps and, thus, that there is no real need to pre-render HTML is fair (because SEO is usually not or less important for apps). But because we are going responsive, we will inherently pay a lot attention to mobile and, thus, to performance as well. This is why we are betting heavily on progressive enhancement.

Responsive Web Design

RWD has mostly to do with not knowing the screen’s width. We have multiple tools to work with, such as media queries, relative units and responsive images. No matter how wonderful RWD is conceptually, some technical issues still need to be solved.

start-image_mini
Not many big websites have gone truly responsive since The Boston Globe. (Image credits: Antoine Lefeuvre)

Client-Side Solutions

In the end, RWD is mostly about client-side solutions. Assuming that the server basically sends the same initial document and resources (images, CSS and JavaScript) to every device, any responsive measures will be taken on the client, such as:

  • applying specific styles through media queries;
  • using (i.e. polyfilling) <picture> or @srcset to get responsive images;
  • loading additional content.

Some of the issues surrounding RWD today are the following:

  • Responsive images haven’t been standardized.
  • Devices still load the CSS behind media queries that they never use.
  • We lack (browser-supported) responsive layout systems (think flexbox, grid, regions, template).
  • We lack element queries.

Server-Side Solutions: Responsive Content

Imagine that these challenges (such as images not being responsive and CSS loading unnecessarily) were solved on all devices and in all browsers, and that we didn’t have to resort to hacks or polyfills in the client. This would transfer some of the load from the client to the server (for instance, the CMS would have more control over responsive images).

But we would still face the issue of responsive content. Although many believe that the constraints of mobile help us to focus, to write better content and to build better designs, sometimes it’s simply not enough. This is where server-side solutions such as RESS and HTTP Client Hints come in. Basically, by knowing the device’s constraints and features up front, we can serve a different and optimized template to it.

Assuming we want to COPE, DRY and KISS and stuff, I think it comes down to where you want to draw the line here: the more important that performance and content tailored to each device is, the more necessary server-side assistance becomes. But we also have to bet on user-agent detection and on content negation. I’d say that this is a big threshold, but your mileage may vary. In any case, I can see content-focused websites getting there sooner than Web apps.

Having said that, I am focusing on RWAs in this article without resorting to server-side solutions.

Responsive Behavior

RWD is clearly about layout and design, but we will also have to focus on responsive behavior. It is what makes applications different from websites. Fluid grids and responsive images are great, but once we start talking about Web applications, we also have to be responsive in loading modules according to screen size or device capability (i.e. pretty much media queries for JavaScript).

For instance, an application might require GPS to be usable. Or it might contain a large interactive table that just doesn’t cut it on a small screen. And we simply can’t set display: none on all of these things, nor can we build everything twice.

We clearly need more.

Part 2: Building RWAs

To quickly recap, our fundamental concepts are:

  • progressive enhancement,
  • responsive design,
  • responsive behavior.

Fully armed, we will now look into a way to build responsive, context-aware applications. We’ll do this by declaratively specifying modules, conditions for loading modules, and extended modules or variants, based on feature detection and media queries. Then, we’ll dig deeper into the mechanics of dependency injection to see how all of this can be implemented.

Declarative Module Injection

We’ll start off by applying the concepts of progressive enhancement and mobile first, and create a common set of HTML, CSS and JavaScript for all devices. Later, we’ll progressively enhance the application based on content, screen size, device features, etc. The foundation is always plain HTML. Consider this fragment:


<div data-module="myModule">
    <p>Pre-rendered content</p>
</div>

Let’s assume we have some logic to query the data-module attribute in our document, to load up the referenced application module (myModule) and then to attach it to that element. Basically, we would be adding behavior that targets a particular fragment in the document.

This is our first step in making a Web application responsive: progressive module injection. Also, note that we could easily attach multiple modules to a single page in this way.

Conditional Module Injection

Sometimes we want to load a module only if a certain condition is met — for instance, when the device has a particular feature, such as touch or GPS:


<div data-module="find/my/dog" data-condition="gps">
    <p>Pre-rendered fallback content if GPS is unavailable.</p>
</div>

This will load the find/my/dog module only if the geolocation API is available.

Note: For the smallest footprint possible, we’ll simply use our own feature detection for now. (Really, we’re just checking for 'geolocation' in navigator.) Later, we might need more robust detection and so delegate this task to a tool such as Modernizr or Has.js (and possibly PhoneGap in hybrid mode).

Extended Module Injection

What if we want to load variants of a module based on media queries? Take this syntax:


<div data-module="myModule" data-variant="large">
    <p>Pre-rendered content</p>
</div>

This will load myModule on small screens and myModule/large on large screens.

For brevity, this single attribute contains the condition and the location of the variant (by convention). Programmatically, you could go mobile first and have the latter extend from the former (or separated modules, or even the other way around). This can be decided case by case.

Media Queries

Of course, we couldn’t call this responsive if it wasn’t actually driven by media queries. Consider this CSS:


@media all and (min-width: 45em) {
	body:after {
		content: 'large';
		display: none;
	}
}

Then, from JavaScript this value can be read:


var size = window.getComputedStyle(document.body,':after').getPropertyValue('content');

And this is why we can decide to load the myModule/large module from the last example if size === "large", and load myModule otherwise. Being able to conditionally not load a module at all is useful, too:


<div data-module="myModule" data-condition="!small">
    <p>Pre-rendered content</p>
</div>

There might be cases for media queries inside module declarations:


<div data-module="myModule" data-matchMedia="min-width: 800px">
    <p>Pre-rendered content</p>
</div>

Here we can use the window.matchMedia() API (a polyfill is available). I normally wouldn’t recommend doing this because it’s not very maintainable. Following breakpoints as set in CSS seems logical (because page layout probably dictates which modules to show or hide anyway). But obviously it depends on the situation. Targeted element queries may also prove useful:


<div data-module="myModule" data-matchMediaElement="(min-width: 600px)"></div>

Please note that the names of the attributes used here represent only an example, a basic implementation. They’re supposed to clarify the idea. In a real-world scenario, it might be wise to, for example, namespace the attributes, to allow for multiple modules and/or conditions, and so on.

Device Orientation

Take special care with device orientation. We don’t want to load a different module when the device is rotated. So, the module itself should be responsive, and the page’s layout might need to accommodate for this.

Connecting The Dots

The concept of responsive behavior allows for a great deal of flexibility in how applications are designed and built. We will now look into where those “modules” come in, how they relate to application structure, and how this module injection might actually work.

Applications and Modules

We can think of a client-side application as a group of application modules that are built with low-level modules. As an example, we might have User and Message models and a MessageDetail view to compose an Inbox application module, which is part of an entire email client application. The details of implementation, such as the module format to be used (for example, AMD, CommonJS or the “revealing module” pattern), are not important here. Also, defining things this way doesn’t mean we can’t have a bunch of mini-apps on a single page. On the other hand, I have found this approach to scale well to applications of any size.

A Common Scenario

An approach I see a lot is to put something like <div id="container"> in the HTML, and then load a bunch of JavaScript that uses that element as a hook to append layouts or views. For a single application on a single page, this works fine, but in my experience it doesn’t scale well:

  • Application modules are not very reusable because they rely on a particular element to be present.
  • When multiple applications or application modules are to be instantiated on a single page, they all need their own particular element, further increasing complexity.

To solve these issues, instead of letting application modules control themselves, what about making them more reusable by providing the element they should attach to? Additionally, we don’t need to know which modules must be loaded up front; we will do that dynamically. Let’s see how things come together using powerful patterns such as Dependency Injection (DI) and Inversion of Control (IOC).

Dependency Injection

You might have wondered how myModule actually gets loaded and instantiated.

Loading the dependency is pretty easy. For instance, take the string from the data-module attribute (myModule), and have a module loader fetch the myModule.js script.

Let’s assume we are using AMD or CommonJS (either of which I highly recommended) and that the module exports something (say, its public API). Let’s also assume that this is some kind of constructor that can be instantiated. We don’t know how to instantiate it because we don’t know exactly what it is up front. Should we instantiate it using new? What arguments should be passed? Is it a native JavaScript constructor function or a Backbone view or something completely different? Can we make sure the module attaches itself to the DOM element that we provide it with?

We have a couple of possible approaches here. A simple one is to always expect the same exported value — such as a Backbone view. It’s simple but might be enough. It would come down to this (using AMD and a Backbone view):


var moduleNode = document.querySelector('[data-module]'),
    moduleName = node.getAttribute('data-module');

require([moduleName], function(MyBackBoneView) {
    new MyBackBoneView({
        el: moduleNode
    });
})

That’s the gist of it. It works fine, but there are even better ways to apply this pattern of dependency injection.

IOC Containers

Let’s take a library such as the excellent wire.js library by cujoJS. An important concept in wire.js is “wire specs,” which essentially are IOC containers. It performs the actual instantiation of the application modules based on a declarative specification. Going this route, the data-module should reference a wire spec (instead of a module) that describes what module to load and how to instantiate it, allowing for practically any type of module. Now, all we need to do is pass the reference to the spec and the viewNode to wire.js. We can simply define this:


wire([specName, { viewNode: moduleNode }]);

Much better. We let wire.js do all of the hard work. Besides, wire has a ton of other features.

In summary, we can say that our declarative composition in HTML (<div data-module="">) is parsed by the composer, and consults the advisor about whether the module should be loaded (data-condition) and which module to load (data-module or data-variant), so that the dependency injector (DI, wire.js) can load and apply the correct spec and application module:

Declarative Composition

Detections for screen size and device features that are used to build responsive applications are sometimes implemented deep inside application logic. This responsibility should be laid elsewhere, decoupled more from the particular applications. We are already doing our (responsive) layout composition with HTML and CSS, so responsive applications fit in naturally. You could think of the HTML as an IOC container to compose applications.

You might not like to put (even) more information in the HTML. And honestly, I don’t like it at all. But it’s the price to pay for optimized performance when scaling up. Otherwise, we would have to make another request to find out whether and which module to load, which defeats the purpose.

Wrapping Up

I think the combination of declarative application composition, responsive module loading and module extension opens up a boatload of options. It gives you a lot of freedom to implement application modules the way you want, while supporting a high level of performance, maintainability and software design.

Performance and Build

Sometimes RWD actually decreases the performance of a website when implemented superficially (such as by simply adding some media queries or extra JavaScript). But for RWA, performance is actually what drives the responsive injection of modules or variants of modules. In the spirit of mobile first, load only what is required (and enhance from there).

Looking at the build process to minify and optimize applications, we can see that the challenge lies in finding the right approach to optimize either for a single application or for reusable application modules across multiple pages or contexts. In the former case, concatenating all resources into a single JavaScript file is probably best. In the latter case, concatenating resources into a separate shared core file and then packaging application modules into separate files is a sound approach.

A Scalable Approach

Responsive behavior and complete RWAs are powerful in a lot of scenarios, and they can be implemented using various patterns. We have only scratched the surface. But technically and conceptually, the approach is highly scalable. Let’s look at some example scenarios and patterns:

  • Sprinkle bits of behavior onto static content websites.
  • Serve widgets in a portal-like environment (think a dashboard, iGoogle or Netvibes). Load a single widget on a small screen, and enable more as screen resolution allows.
  • Compose context-aware applications in HTML using reusable and responsive application modules.

In general, the point is to maximize portability and reach by building on proven concepts to run applications on multiple platforms and environments.

Future-Proof and Portable

Some of the major advantages of building applications in HTML5 is that they’re future-proof and portable. Write HTML5 today and your efforts won’t be obsolete tomorrow. The list of platforms and environments where HTML5-powered applications run keeps growing rapidly:

  • As regular Web applications in browsers;
  • As hybrid applications on mobile platforms, powered by Apache Cordova (see note below):
    • iOS,
    • Android,
    • Windows Phone,
    • BlackBerry;
  • As Open Web Apps (OWA), currently only in Firefox OS;
  • As desktop applications (such as those packaged by the Sencha Desktop Packager):
    • Windows,
    • OS X,
    • Linux.

Note: Tools such as Adobe PhoneGap Build, IBM Worklight and Telerik’s Icenium all use Apache Cordova APIs to access native device functionality.

Demo

You might want to dive into some code or see things in action. That’s why I created a responsive Web apps repository on GitHub, which also serves as a working demo.

Conclusion

Honestly, not many big websites (let alone true Web applications) have gone truly responsive since The Boston Globe. However, looking at deciding factors such as cost, distribution, reach, portability and auto-updating, RWAs are both a huge opportunity and a big challenge. It’s only a matter of time before they become much more mainstream.

We are still looking for ways to get there, and we’ve covered just one approach to building RWAs here. In any case, declarative composition for responsive applications is quite powerful and could serve as a solid starting point.

(al) (ea)

© Lars Kappert for Smashing Magazine, 2013.

0
Your rating: None
Original author: 
Fred Ritchin

What do we want from our media revolution? Not just where is it bringing us—but where do we want to go? When the pixels settle, where do we think we should be in relationship to media—as producers, subjects, viewers? Since all media inevitably change us, how do we want to be changed?

There used to be a time when one could show people a photograph and the image would have the weight of evidence—the “camera never lies.” Certainly photography always lied, but as a quotation from appearances it was something viewers counted on to reveal certain truths. The photographer’s role was pivotal, but constricted: for decades the mechanics of the photographic process were generally considered a guarantee of credibility more reliable than the photographer’s own authorship.

But this is no longer the case. The excessive use of photographs to “brand” an image (whether of oneself online, of celebrities, of products, of major companies, or of governments), and to illustrate preconceptions rather than to uncover what is there (presidents are made to look presidential, and poor people are generally depicted as victimized), as well as the extraordinary malleability of the photograph due to software such as Photoshop, make photography more of a rhetorical strategy, like words, rather than an automatic proof of anything. Photographs must now persuade, often in concert with other media, rather than rely on a routine perception that they inevitably record the way things are.

The billion or so people with camera-equipped cellphones, meanwhile, make photography, like all social media, an easily distributed exchange of information and opinions with few effective filters to help determine which are the most relevant and accurate. The professional photojournalist and documentarian, now a tiny minority of those regularly photographing, often are unsure not only how to reach audiences through the media haze, but also how to get their viewers to engage with the often extraordinarily important situations they witness and chronicle.

This moment of enormous transition forces a rethinking of what photography can do, and what we want it to accomplish. For example, if a young person wanted to become a war photographer, we have hundreds of books showing how others have photographed war. But what if a young person wanted, instead, to become a photographer of peace? The genre, unfortunately, does not yet exist.

Perhaps, then, we might want to begin focusing less on the spectacle of war and more on those impacted by the consequences of war—as Monica Haller has done, along with many others. The all-type cover of her book, Riley and His Story, disputes any conventional reading: “This is not a book. This is an invitation, a container for unstable images, a model for further action…. Riley was a friend in college and later served as a nurse at Abu Ghraib prison. This is a container for Riley’s digital pictures and fleeting traumatic memories. Images he could not fully secure or expel and entrusted to me…. This is not a book. It is an object of deployment.”

The collaboration is intended to help Riley Sharbonno resurrect buried memories and deal with some of what he went through in a war that destabilized his life. There are pictures that he does not remember taking of events that he does not remember witnessing. Photographs, once rediscovered, sometimes assuage his guilt, providing a reason for what has happened. Some of the grand half-truths about war are diluted. But there is anger, too: “I want you to see what this war did to Riley.”

Similarly, Jennifer Karady revisits the enduring trauma of violent conflict in her collaborations with soldiers, working for about a month with each one to re-stage calamitous situations in civilian life that they had experienced in war. Finding a discarded tire on the side of the road in Virginia evokes memories of a possible IED, for instance, or looking out of a window in upstate New York while protected by sandbags recalls a vulnerability to attack—each of these pictures is made with family members participating. Karady views the procedure as potentially therapeutic for those involved, while helping to make the legacy of war somewhat more comprehensible to family and friends stateside. And unlike the imagery from so many war photographers, her pictures are not at all glamorous.

Some are also using their photographs to make sure that the violence is not forgotten by the broader society. In her project “Reframing History,” Susan Meiselas returned to Nicaragua in 2004 with nineteen murals created from her own photographs made during that country’s Sandinista Revolution twenty-five years earlier. She placed the murals at the sites where the imagery was originally made, collaborating with local communities in visualizing their own collective memories and also helping to better acquaint Nicaraguan youth with their own past. (Imagine then if it were possible to place photographs from Robert Frank’s landmark book, The Americans, made in the 1950s, on billboards around this country where the photos were made—given the critical nature of many of his photographs, it would be an extraordinary way to gauge societal change, or the lack of it.)

And some are trying to share the vagaries of war as they occur in a sort of real-time family album. Basetrack, created by Teru Kuwayama and Balazs Gardi, was an experimental social-media project that consisted of a small team of embedded photographers primarily using iPhones, which focused upon about a thousand Marines in the 1st Battalion, Eighth Marines, during their deployment to southern Afghanistan in 2010–11. They curated a news feed alongside their own efforts, employed Google Maps as an interface, wrote posts in addition to photographing, all with a view “to connect[ing] a broader public to the longest war in U.S. history,” intent on involving their audience, many of them family members, in the discussion. Trying to establish transparency, they created an editing tool for the military to censor photographs and texts that might put soldiers in danger, and asked the military to supply reasons for the censorship, which were then made visible when a viewer placed the cursor over the blacked-out section.

It was a relatively effective system, until in 2011, when the Facebook discussion became too difficult for the military to handle and the photographers were “uninvited” a month before the troops’ deployment ended. Apparently a good deal of the content that military officials found problematic was about relatively minor matters, such as parents complaining that their sons and daughters had to wear brown and not white socks on patrol. Now only the Facebook page is still active, with curated news and continuing audience discussions. One mother’s response to the project: “It has truly saved me from a devastating depression and uncontrollable anxiety after my son deployed. Having this common ground with other moms helped me so much and gives me encouragement each day.”

And then there are others who, rather than wait for the apocalypse, are attempting to see what can be done to help prevent it. In James Balog’s long-term photography project, “Extreme Ice Survey,” cameras are positioned in remote arctic and alpine areas, automatically photographing the melting of the ice to help more precisely calculate the impact of global warming, and to create a visual record of a planet in crisis. According to the EIS website: “currently, 28 cameras are deployed at 13 glaciers in Greenland, Iceland, the Nepalese Himalaya, Alaska and the Rocky Mountains of the U.S. These cameras record changes in the glaciers every half hour, year-round during daylight, yielding approximately 8,000 frames per camera per year.”

Or, if we want to make sure that the opinions of the subjects photographed are better understood, why not at times show them their image on the back of the digital camera, and ask what they think of the ways in which they are depicted, and record their voices?  An even more collaborative exchange of perceptions is that between Swedish photographer Kent Klich and Beth R., a former prostitute and drug addict living in Copenhagen whom he began photographing in the 1980s. In the 2007 book Picture Imperfect, his photographs, along with case histories and images from Beth’s family album as a child, are paired with an enclosed DVD of Beth’s daily life for which she herself was the primary filmmaker.

Finally, when making pictures, maybe they can serve another, more practical function. For French artist JR’s 2008–2009 project, “28 Millimeters, Women Are Heroes,” photographs were not only used to document the faces of women living in modest dwellings in various countries, but in Kenya he began to make the oversize prints water-resistant so that when used as roof coverings the pictures themselves would help to protect the women’s fragile houses in the rainy season

Countless innovators, often working far from the spotlight, are today creating visual media that can be useful in a variety of ways. Rather than simply attempting to replicate previous photographic icons and strategies, these newer efforts are essential to revitalizing a medium that has lost much of its power to engage society on larger issues.

And then what is needed are people who can figure out effective and timely ways to curate the enormous numbers of images online from all sources—amateur and professional alike—so this imagery too can play a larger role. As badly as we need a reinvention of photography, we also will require an assertive metaphotography that contextualizes, authenticates, and makes sense of the riches within this highly visible but largely unexplored online archive.

Fred Ritchin is a professor at NYU and co-director of the Photography & Human Rights program at the Tisch School of the Arts. His newest book, Bending the Frame: Photojournalism, Documentary, and the Citizenwas published by Aperture in 2013.

0
Your rating: None