Showing posts with label Javascript. Show all posts
Showing posts with label Javascript. Show all posts

Sunday, August 31, 2014

The introduction of the <picture> tag

Chrome 38 is introducing extensions to HTML5. Welcome the <picture> tag. The tag will allow a simpler and more elegant way of sending multiple versions of a graphic, making responsive design that much easier to implement.
<picture>
    <source media="(min-width: 45em)" srcset="large.jpg">
    <source media="(min-width: 32em)" srcset="med.jpg">
    <img src="small.jpg" alt="">
</picture>
It's also introducing some new ES6 feature- which will make storing and interacting with data simpler.

Saturday, April 20, 2013

Closure versus Closure

I'm working to improve my javascript skills and am struggling to absorb, to grok, closures. I find that in addition to the issues in getting past the basic definition of a closure: that it is "code that remembers the outer environment from where it came while still being usable to where it has been brought." that I have overloaded the term.. Closure is also a graphic design term and I realize that somewhere, whenever I hear the word closure I keep thinking about "completing" code; or completing a partially worked out idea.

Wow. Talk about overloading and conflating terms. For the programmers out their who are not familiar with it closure is one of the components of Gestalt Theory which describes how the mind organizes visual data. Apparently while psychologists have rejected Gestalt Theory as it does not accurately reflect human cognition - graphic designers and HCI folks have adopted it as useful in understanding how it is that humans interact with their products / applications. For instance: "why is it that human beings don't always see something right in front of their face?" Or "why are somethings found and other things ignored?"

We, as UX professionals, have to understand this when thinking about how the user is going through the application. In addition to all the other burdens faced by the user we have to take into account the fact that the user's cognitive ability will be altered/enhanced/impaired by what it is he is focused on at the time he is using the app.



A closure, in design terms, is the ability, the tendency of the mind to fill in the gaps with expected information.
The importance of this is that we must take into consideration what it is that the user is expecting which in turn comes from what it is that the user is looking to do.

Sunday, June 11, 2006

Sprites What are they good for?

I never particularly cared much for them. I had nothing against them. I personally (unlike others) found having all the images in one graphic file easier to maintain; and yes it was less of a server hit but I never had a time, until now, where I found sprites to be indispensable.

I have a complex image: an intertwined pie-chart that highlights as different parts are rolled over. And now - I have a use for sprites. I cannot see how this user interface could have been accomplished without sprites. One can even imagine, that with javascript, one can display different information based on other factors than simply the mouseover.

For example a class name could be added to the div (via server-side script) based on almost any factor and then different information could be shown to different users (or even the same user) as needed.

This user interface is for the marketing department of a well-know company. It displays the course work and tests necessary for employees a variety of certification. So class names can be appended to the div; and javascript can display different text as needed. Example: If user has completed course X then show "Completed" elseif show "In Progress" else "Not Started".