Archive for March, 2010

File Under: Software, UI/UX, Visual Design
Mar
26
2010

Adobe’s Magical ‘Content Aware Fill’ Bends Pixels to Your Will

By

pscs4Adobe is already counting down to a new version of its creative suite, with updates for Dreamweaver, Flash, Photoshop and other apps common in the web designer’s toolkit. While the company is characteristically tight-lipped about new features, it is showing off a mind-bending new tool for Photoshop — content aware fill.

Like the content aware scaling (AKA seam stitching) in the current version of Photoshop, content aware fill is about intelligently adding, removing and changing objects in an image based on what’s around them. While that sounds fairly prosaic, seeing it in action will blow you away.

The video above starts a bit slowly (photographers would no doubt argue, realistically), if you just want to see the crazy stuff skip to the halfway point.

As always Adobe isn’t saying the content aware fill will be in Photoshop CS5 (due next month), but that’s really their way of saying it will be in Photoshop CS5 because no company in its right mind would show off these features and not deliver them shortly thereafter.

If you’re interested in learning more about the tech behind the content aware fill features, check out the Adobe website which features another, earlier demo movie.

If the content aware fill whets your appetite for CS5, well you don’t have long to wait. In fact, thanks to Adobe’s CS 5 countdown site we can tell you you only have 17 days, 00 hours, 00 minutes and 49 seconds as of this writing.

Normally we’re not ones for promo sites, but this one is notable because Adobe created the entire site without any gratuitous Flash elements. See, Adobe is embracing the modern web.

See Also:

Tags: , ,
File Under: Browsers, Security
Mar
25
2010

Web Browsers Crushed in ‘Pwn2Own’ Contest

By

iphone_finger200px

Think your web browser is secure? Think again. Nearly every common browser on the web has been compromised as part of the Pwn2Own contest at the annual CanSecWest security conference.

Whether it was Internet Explorer on WIndows 7, Safari on OS X, Firefox on Windows or Mobile Safari on the iPhone, just about every browser on the market proved compromisable in some way.

Perhaps the most notable of the hacks is the iPhone exploit, in which a hacker managed to download the entire SMS database of a fully patched (non-jailbroken) iPhone 3GS, grabbing the complete list of contacts and any stored messages.

As in the real world, the Pwn2Own exploit code was delivered via specially-crafted, malicious websites which target a specific flaw in your browser.

Safari, Firefox and Internet Explorer were all compromised, but there is one notable exception — Google’s Chrome browser.

One of the key aspects of Chrome that has — thus far — stopped the Pwn2Own hackers is its tightly sandboxed code, which makes it very difficult to exploit. Which isn’t to say there aren’t bugs in Chrome, just that exploiting them to do dirty work outside of Chrome, and thus compromise Windows, Linux or OS X, is much more difficult than it is with other browsers.

For users of IE, Firefox, Safari and Mobile Safari, the only real solution for any security woes is to wait for software updates patching the flaws. Microsoft, which is a CanSecWest sponsor, says it’s already investigating the flaws in Internet Explorer.

Given that one contestant arrived at Pwn2Own with some 20 working exploits for OS X, we’re hoping Apple does the same, but sadly, the company is notorious lax when it comes to patching security flaws in its software.

If you’d like more information about the specific exploits used on each browser, see CNet’s coverage of the nitty-gritty Pwn2Own details.

See Also:

Tags: , , ,
File Under: UI/UX, Web Standards
Mar
24
2010

Beautiful Websites: Pictory’s Ode to Spring

By

pictory1

There’s currently a debate raging in the publishing world over whether the web is robust enough of a platform to present magazine-like stories properly — paginated content heavy on photography, design and stylized type. The current popular opinion is that the web is not up to snuff, and thus the scramble towards dedicated readers and apps specially built for new devices like the iPad. Also, the reason for the print industry’s long-standing relationship with Flash, which handles such things in a manner that’s good enough for most.

But the web continues to mature as a presentation platform. Here’s another example of that growth: Pictory, the most recent endeavor from designer and editor Laura Brunow Miner. The site showcases captioned photography in a very magazine-like manner.

Check out the latest “issue,” a showcase on the arrival of Spring. It’s gorgeous, and it’s all done in semantic HTML, JavaScript and CSS. The fonts are provided by Typekit. The page-to-page navigation is controlled by the left and right arrow keys, but your scroll wheel works, too. There are even hidden gems, like the scripted event that makes the flowers on the title page bloom when the mouse moves over them.

When you’re done browsing Pictory, read Laura’s essay on her personal blog about how the web’s flexibility shaped her view of what’s possible in a digital magazine.

Tags: , ,
File Under: Browsers, HTML5
Mar
24
2010

The Trials and Tribulations of Internet Explorer

By

ie_logo

Every few months, we see a new set of statistics or a new report showing how Internet Explorer is losing browser share, becoming increasingly irrelevant or dying on the vine. This of course sets off ripples across the tech blogs, which gather into a wave of “Death of IE” posts that we all tweet, Digg and generally take pleasure in passing around and commenting on.

Which is not to say these blog posts are at all wrong or untrue. Internet Explorer is losing browser share, relevance and vitality. And more so lately than ever before — the most recent wave of “IE’s Dead” posts, which hit us this week, includes some sound analysis and stats that show IE is losing serious footing on the open web.

One key event was the inclusion of the browser selection screen for European Windows users, which Microsoft was forced to add following a recent ruling by the EU (We posted a preview of the screen last month). The browser choice screen gives users the option of downloading an alternative browser, and the immediate result of the feature’s rollout was a dip in IE’s market share.

Early data from Quantcast shows an immediate five percent decline. IE’s loss seems to have stabilized at around the three percent mark after a few days, though (maybe some of those who switched actually missed IE). The big winner among browser-makers seems to be Firefox, which saw around a two percent jump after the choice screen debuted.

Continue Reading “The Trials and Tribulations of Internet Explorer” »

Tags: , , , ,
File Under: Programming, Security
Mar
24
2010

XSS Vulnerabilities, Raw SQL Top List of Common Programming Errors

By

bobbytablesNo programmer is perfect, but some mistakes are more dangerous than others. While some mistakes might just slow down your site, others can open up vulnerabilities that expose your code, your database and even your users to all manner of attack.

To help you identify the more serious errors common in programs of all types, a group of top software security experts in the US and Europe have released their Top 25 Most Dangerous Programming Errors.

Unsurprisingly, cross-site scripting vulnerabilities and improperly handled SQL top the list of common and dangerous mistakes. Remember kids, sanitize your database inputs; you just never know when someone is going to name their child: “Robert’) DROP TABLE Students;”

While not all the errors in the list are common in web programming, some of the more serious things are concerns for web developers — cross-site request forgeries, missing encryption of sensitive data and unrestricted file uploads are all common web programming issues.

Also interesting is the weaknesses by language section, which breaks down common mistakes in PHP, Java, Perl and C/C++. No doubt web developers would like to have seen Python and Ruby in that list, but it should at least be useful for PHP and Perl programmers.

See Also:

Tags: , , ,
File Under: Browsers, Mobile
Mar
23
2010

Video: Opera Mini on the iPhone

By

As we mentioned last week, we got to see a preview of Opera’s Mini 5 browser running on the iPhone. Opera was showing off the app at its booth at the South By Southwest Interactive conference in Austin, Texas. But the Opera folks wouldn’t let us photograph it or shoot video of it, and they couldn’t provide us with anything other than a pre-approved screenshot. But now Opera has released a video of the tiny browser in action, embedded above.

Opera Mini 5 has been submitted to the Apple App Store and is currently awaiting approval.

The browser looks fast — certainly much faster than Safari on the iPhone. The big difference is Opera’s server-side compression technology it uses for Mini, which squishes pages and images down to about 10-20% of their original size before they are sent over the tubes. As a result, some multi-touch functionality (like “the pinch”) is disabled, but the browser is fast.

Also pay attention to the tab switcher, and the tap-to-zoom function, both of which are well-executed.

See Also:

Tags: , , ,
File Under: JavaScript, Programming
Mar
22
2010

Conway’s Game of Life in JavaScript

By

picture-5

The Game of Life, the most famous example of cellular automata and the basis of countless generative music, art and computer programming projects, has its own JavaScript simulator.

The concept, created in 1970 by the mathematician John Conway, relies on very simple rules applied to cells on a board. The cells are either “on/alive” or “off/dead,” and their behavior is determined by the states of their neighbors. There are rules — the human draws a pattern of cells on the board, then begins the game. The rules play out automatically and the game progresses without any further human interaction.

Brian Eno is a big fan. Check out his Bloom and Trope iPhone apps for some pleasant examples of generative game music done well.

Here’s the Game of Life as described by Wikipedia:

The universe of the Game of Life is an infinite two-dimensional orthogonal grid of square cells, each of which is in one of two possible states, live or dead. Every cell interacts with its eight neighbors, which are the cells that are directly horizontally, vertically, or diagonally adjacent. At each step in time, the following transitions occur:

1. Any live cell with fewer than two live neighbors dies, as if caused by underpopulation.
2. Any live cell with more than three live neighbors dies, as if by overcrowding.
3. Any live cell with two or three live neighbors lives on to the next generation.
4. Any dead cell with exactly three live neighbors becomes a live cell.

The initial pattern constitutes the seed of the system. The first generation is created by applying the above rules simultaneously to every cell in the seed?births and deaths happen simultaneously, and the discrete moment at which this happens is sometimes called a tick (in other words, each generation is a pure function of the one before). The rules continue to be applied repeatedly to create further generations.

See also:

Tags: , ,
File Under: Programming, Web Basics
Mar
22
2010

Google Raises Your Coding Skills to a Higher Degree

By

Google Code logo

There are several places on the web you can turn if you want to learn how to program.

Of course, this very site is the best place to start. Webmonkey has a massive library spanning over 13 years of web tutorials. There’s also Sitepoint and Smashing Magazine and O’Reilly Answers.

Today, we’d like to give some massive props to Google Code University, a site with a small (but growing) library of tutorials, slide shows, presentations and lectures about coding for the web. There’s also lots of just plain good advice for making everything from simple sites to full-blown apps. The site is heavy on video — most of the videos are lectures taken from Google’s internal tech talks — and on slide presentations. Everything is licensed under the Creative Commons, so you can use the code examples in your own projects providing you include attribution.

The Ajax and Python courses are pretty strong. The Geo APIs courses are valuable resources for anyone working with geodata. For more advanced topics, check out the Distributed Systems and Web Security tutorials.

See also:

Tags: , ,
File Under: JavaScript, Programming
Mar
19
2010

Code Optimizers Can Make View Source Useless

By

Image: Wikipedia/CC

Image: Wikipedia/CC

HTML, CSS and JavaScript have always been visible to the interested end user. Whether through the good old view source option in your browser, or something a bit more sophisticated — like developer favorite Firebug — the code has always been there to learn from.

It’s part of what makes the open web open. But when it comes to JavaScript, it’s possible that openness may soon be a thing of the past.

Alex Russell, developer of Dojo JavaScript Library, recently posted a follow up to his SXSW panel, worrying that tools like Closure obfuscate code to the point that it renders view source meaningless.

What’s different from some tools in other languages (like ActionScript obsfucation tools) is that Closure and others of its ilk aren’t primarily designed to obfuscate, they’re simply optimizing code, making it smaller and faster. As Russell writes, “the Closure Compiler can deliver code that’s much, much smaller than I can wring out by hand and that performs better to boot.”

In other words Closure creates better, faster JavaScript.

However, there’s a trade off that most of us generally ignore — the code generated by such tools is useless from the perspective of curious users trying to learn JavaScript by viewing your source code.

As Russell writes in a followup comment, “poll any average group of web developers and they’ll tell you straight-up that that’s how they learned… not be stealing, but by dissecting and inspecting and tweaking and then re-implementing a technique in a new and unique situation.”

Webmonkey’s own seminal JavaScript tutorial advises: “the best way to learn JavaScript is to look at scripts other people have written. JavaScript, just like HTML, can be viewed by selecting View Source on your browser. Do it frequently!”

Tools like Closure make the source you view of little use. True there are some “de-obfuscation” tools out there — like jsbeautifier.org — but none of them work with tools as sophisticated as Closure.

Now curious newbies trying to teach themselves JavaScript may not be top of your list of concerns when writing code for your website, but Russell is right when he suggests that these “second-order beneficial effects,” that is, the ability to view source and learn from it, are part of what has made the web a success.

The danger is that in taking away the usefulness of view source we’re creating a much less democratic environment for those trying to learn HTML, CSS and JavaScript from tomorrow’s web. And as Russell writes, that’s not “a vision of the web that holds my interest.”

So what’s the answer? Well, there isn’t one really. Some ideas floated by Russell and commenters on his post include letting browsers do the Closure-style byte code compiling before the script is rendered, building better de-obfuscation tools or simply serving up uncompiled versions of the same JavaScript for interested users.

See Also:

File Under: Browsers, Software, Software & Tools
Mar
18
2010

Mozilla Labs Seeks to Tame Your Address Book With ‘Contacts’

By

labs-logo

Mozilla Labs has a new goal — saving your contacts list from the chaos of the web.

If you’re like most of us, your contacts are probably spread out all over the place — in your webmail provider, on social networks like Twitter or Facebook, on your mobile and maybe even hiding in a desktop address book app.

In short, your contacts are a vast, sprawling jungle. Mozilla Labs wants to solve that problem and a new project, dubbed, appropriately enough, Contacts is aiming to help you centralize and organize your various lists.

The Contacts project works by using the browser to sort, organize, access and share your contact data. The information is stored in a local database and — should the project take flight — will eventually be synced across platforms by the Weave add-on.

contactsA prototype of the Contacts interface. Click the image for a larger view.

For now, the most notable features of the Contacts add-on is some very nice auto-completion in web forms. The features is roughly analogous to what Gmail does in the To field of your e-mails, but obviously Contacts’ auto-completion works on any website.

To build the database, Contacts will pull your info from GMail, Twitter and the Mac address book. Mozilla has promised that the list of supported apps and web services will be expanded shortly thanks to the importer API (which eventually will be public, meaning other add-ons can access it).

The other nice thing about Contacts is the per-site privacy control which make it relatively easy to control which sites can grab which data.

Like Mozilla’s Raindrop experiment, Contacts has loads of potential and might one day be another must-have part of Firefox, but for now the add-on is very rough.

If you’d like to take it for a spin there’s an experimental, pre-alpha version of Contacts available for download. Just keep in mind that Contacts is very experimental code and could crash your browser.

If you like what you see in Contacts or you have ideas on how to improve it, be sure to let Mozilla know.

See Also:

Tags: , ,
« OLDER POSTS