| Dutch MP Fined For Ethical Hacking Feb 15th 2013, 23:15 An anonymous reader writes "Dutch Member of Parliament (MP) Henk Krol was fined 750 (US$1,000) by the district court of Oost-Brabant on Friday for breaking and entering the system of the Dutch medical laboratory Diagnostics for You. Krol said he entered the system as an ethical hacker to show that it was easy to access and download confidential medical information. Krol, leader of the Dutch 50plus party, accessed the systems of the laboratory with a login and password he had obtained from a patient of the clinic, who in turn had overheard the information at the laboratory from a psychiatrist that worked there ... In April last year, Krol used the login information to enter the company's Web server and subsequently viewed and downloaded medical files of several patients. He did this to prove how easy it was to get access to the systems, according to the ruling (PDF in Dutch).'" Read more of this story at Slashdot.     |  | Ask Slashdot: Keyboard Layout To Reduce Right Pinky/Ring Finger Usage? Feb 15th 2013, 22:32 Tooke writes "I've developed focal hand dystonia from playing clarinet. It affects my right pinky (and my ring finger, but to a lesser extent). My pinky isn't totally unusable when typing; however, it isn't nearly as agile as it used to be. When I must press a key with it, I tend to keep the whole finger rigid and move my entire hand instead. I also use my ring finger to press the P and semicolon keys (on QWERTY) which is a bit awkward but better than using the pinky. Thus my question: are there any keyboard layouts that are optimized to reduce right pinky/ring finger usage? I switched to Programmer Dvorak a few years ago, but Dvorak seems to make me use my right hand significantly more than my left. I'm considering mirroring the letter keys so my left hand would be used more. I also came across the Workman layout which looks interesting. I might try using that after switching the numbers and symbols around to be more like Programmer Dvorak. Has anyone been in a similar situation? What else could I do to make typing more comfortable? I've got a long career ahead of me as a programmer (I'm currently a high school senior) and I'd like to take care of my hands as much as possible." Read more of this story at Slashdot.     | | Russian Meteor Largest In a Century Feb 15th 2013, 22:10 gbrumfiel writes "A meteor that exploded over Russia's Chelyabinsk region this morning was the largest recorded object to strike the earth in more than a century, Nature reports. Infrasound data collected by a network designed to watch for nuclear weapons testing suggests that today's blast released hundreds of kilotons of energy. That would make it far more powerful than the nuclear weapon tested by North Korea just days ago, and the largest rock to strike the earth since a meteor broke up over Siberia's Tunguska river in 1908. Despite its incredible power, the rock evaded detection by astronomers. Estimates show it was likely only 15 meters across — too small to be seen by networks searching for near earth asteroids." Today's meteor event came a day after California scientists proposed a system to vaporize asteroids that threaten Earth. Of course, the process needs to be started when the asteroid is still tens of millions of kilometers away; there's no chance to shoot down something that's already arrived. Read more of this story at Slashdot.     | | Tim Cook Never Wanted To Sue Samsung Feb 15th 2013, 21:50 colinneagle writes "While Steve Jobs' ire in regards to Android is well known, a recent report from Reuters relays that current Apple CEO Tim Cook never wanted to sue Samsung in the first place. 'Tim Cook, Jobs' successor as Apple chief executive, was opposed to suing Samsung in the first place, according to people with knowledge of the matter, largely because of that company's critical role as a supplier of components for the iPhone and the iPad. Apple bought some $8 billion worth of parts from Samsung last year, analysts estimate.' In various earnings conference calls, Tim Cook has repeated that he hates litigation, but has still toed the party line by exclaiming that Apple welcomes innovators but doesn't like when other companies rip off their intellectual property." Read more of this story at Slashdot.     | | President Obama Calls For New 'Space Race' Funding Feb 15th 2013, 21:09 New submitter dmfinn writes "While his union address covered a wide range of topics, President Obama made sure not to skip over the U.S.'s space program. The talking point was nearly identical to the one he gave in 2009, in which he called for space R&D spending to be increased past the levels seen during the the original cold war space race. Now, 4 years after that speech, it appears things have gone the opposite way. Since 2009 NASA has seen some serious cuts. Not only has the space-shuttle program been deactivated, but the agency was forced to endure harsh funding cuts during the presidents latter term. Despite an ominous history, it now seems that Obama is back on the space objective, pushing congress to increase non-defensive R&D spending to 3% of the U.S. GDP. It's important to keep in mind that not all of this money goes directly to space related programs, though under the proposed budget the National Science Foundation, Department of Energy Office of Science, and the National Institute of Standards and Technology Laboratories will have their budgets doubled. There will also be an increase in tax credits towards companies and organizations working on these R&D projects. Should the U.S. go back to its 'Let's put a man on the moon' ideology, or is the federal government fighting an uphill battle against newly emerging private space expeditions? Either way, the question remains whether or not Obama will act on any of the propositions." Read more of this story at Slashdot.     | | Ultrasound Waves Used To Increase Data Storage Capacity of Magnetic Media Feb 15th 2013, 20:46 Lucas123 writes "Electrical engineers at Oregon State University (OSU) said yesterday that they have found a technique to use high-frequency sound waves to improve magnetic data storage.The data write-technology breakthrough could allow greater amounts of data to be stored on both hard disk drives and NAND flash-based solid-state drives (SSDs), they said. Typically, when magnetic recording material is temporarily heated, even for an instant, it can become momentarily less stiff and more data can be stored at a particular spot. But, the technique has proven difficult to effectively increase capacity because heating tends to spread beyond where it is wanted and the technology involves complex integration of optics, electronics and magnetics, the researchers said. With the new technique, known as acoustic-assisted magnetic recording, ultrasound is directed at a highly specific location on the material while data is being stored, creating elasticity that allows "a tiny portion of the material to bend or stretch." After the ultrasound is turned off, the material immediately returns to its original shape, but the data stored during the process remains in a dense form." Read more of this story at Slashdot.     | | California Cancels $208 Million IT Overhaul Halfway Through Feb 15th 2013, 20:26 g01d4 writes "According to the LA Times, 'California's computer problems, which have already cost taxpayers hundreds of millions of dollars, have mounted as state officials cut short work on a $208-million DMV technology overhaul that is only half done. The state has spent $135 million total on the overhaul so far. The state's contractor, HP Enterprise Services, has received nearly $50 million of the money spent on the project. Botello said the company will not receive the remaining $26 million in its contract. ... Last week, the controller's office fired the contractor responsible for a $371-million upgrade to the state's payroll system, citing a trial run filled with mishaps. More than $254 million has already been spent.' It's hard not to feel like the Tokyo man in the street watching the latest round of Godzilla the state vs. Rodan the big contractor." Read more of this story at Slashdot.     | | Ubuntu For Phones To Arrive Next Week On Nexus 4 Feb 15th 2013, 19:44 nk497 writes "Canonical has revealed that a developer preview of Ubuntu for phones will arrive next week, on the 21st of February. The touch preview will initially only be available for the Galaxy Nexus and Nexus 4 smartphones, but Canonical plans to support more devices. The release is designed to let developers create apps — and to give 'enthusiasts' a sneak peek — ahead of the smartphone side of Ubuntu arriving in version 13.10 in October. Canonical suggested that the OS will initially only support low-end smartphones, but the group plans to also support higher-end models, too, and the OS will work across mobile devices, PCs and TVs." Read more of this story at Slashdot.     | | The State of BSD At the Start of 2013 Feb 15th 2013, 19:17 An anonymous reader writes "NetBSD developer Julian Djamil Fagir provides a nice briefing on what the big three BSD projects have been working on, and explains/reminds us of their cultural differences. Stick a fork in them? Yes, Djamil Fagir mentions a couple of those, too. The recent releases from FreeBSD and NetBSD were covered by Slashdot." Read more of this story at Slashdot.     | | Alcoholism Vaccine Makes Alcohol Intolerable To Drinkers Feb 15th 2013, 19:02 Hugh Pickens writes "Ariel Schwartz reports that researchers are working on an alcoholism vaccine that makes alcohol intolerable to anyone who drinks it. The vaccine builds on what happens naturally in certain people — about 20% of the Japanese, Chinese, and Korean population — with an alcohol intolerance mutation. Normally, the liver breaks down alcohol into an enzyme that's transformed into the compound acetaldehyde (responsible for that nasty hangover feeling), which in turn is degraded into another enzyme. The acetaldehyde doesn't usually have time to build up before it's broken down. But people with the alcohol intolerance mutation lack the ability to produce that second enzyme; acetaldehyde accumulates, and they feel terrible. Dr. Juan Asenjo and his colleagues have come up with a way to stop the synthesis of that second enzyme via a vaccine, mimicking the mutation that sometimes happens naturally. 'People have this mutation all over the world. It's like how some people can't drink milk,' says Asenjo. Addressing the physiological part of alcohol addiction is just one piece of the battle. Addictive tendencies could very well manifest in other ways; instead of alcohol, perhaps former addicts will move on to cigarettes. Asenjo admits as much: 'Addiction is a psychological disease, a social disease. Obviously this is only the biological part of it.'" Read more of this story at Slashdot.     | | Asteroid 2012 DA14 Approaches Feb 15th 2013, 18:02 Today at about 19:25 UTC (2:25 PM EST), Asteroid 2012 DA14 will make its closest approach to Earth, passing a mere 27,650 kilometers above the surface — closer than our satellites in geosynchronous orbit. NASA is broadcasting a live-steam showing the asteroid from an Observatory, and will have coverage on NASA TV starting about a half-hour before closest approach. The Planetary Society will be broadcasting a live webcast, and Phil Plait will be hosting a Google+ Hangout. NASA has also compiled a nice post filled with information about the asteroid, including trajectory diagrams, animated videos of the path, and answers to question about 2012 DA14. You can also watch it move at 50x actual speed through a telescope. They take pains to note that there is no danger of the asteroid striking the planet today, or any time in the forseeable future. Its next notably close approach in 2046 will only bring it about a million kilometers away. What makes 2012 DA14 significant is that it's rather large — it's 45 meters across and weighs about 130,000 metric tons. It's also moving about 7.8 kilometers per second relative to Earth. "To view the asteroid, you will need a good pair of binoculars, or even better, a moderately powered telescope. During the closest approach, and dependant on local weather, the asteroid will be visible from parts of Europe, Africa and Asia. The asteroid will appear to be moving relatively quickly as it crosses the sky from the south to the north." NASA says this morning's meteor event in Russia was unrelated. Read more of this story at Slashdot.     | | Ask Slashdot: Is the Bar Being Lowered At Universities? Feb 15th 2013, 17:32 An anonymous reader writes "I am in my late 20s, live in the U.S., work in the IT industry, and am going to school to upgrade from an associate's degree to a bachelor's degree. One of my classes is a web-based course that requires students to write blogs. I am not attending one of those questionable for-profit schools. This is a large, state-funded, public university. In this course I have noticed poor writing skills are the norm rather than the exception. It is a 3rd year course, so students should have successfully completed some sort of writing course prior to this one. Blog posts, which students are graded on, tend to be very poorly written. They are not organized into paragraphs, have multiple run-on sentences, and sometimes don't make sense. I do not know what grades they are receiving for these posts. Slashdot, is what I am seeing the exception, or the norm? Is the bar being lowered for university students, or am I just expecting too much?" Read more of this story at Slashdot.     | | EFF Proposes a Working Code Requirement For Software Patents Feb 15th 2013, 17:01 Juha Saarinen sends news that the Electronic Frontier Foundation has proposed a fix for software patents in general and patent trolls in particular: requiring applicants to provide specifics about their solution. They say the applications should include working code, or at least "detailed, line-by-line notations explaining how their code works." "And if they do get a patent, they should be limited to the invention they claimed. We think software patents are bad news, and incredibly harmful to our society and economy. We wish we didn’t have to deal with them at all. But by fixing the functional claiming problem, and limiting patentees to a narrow invention that they actually came up with, we would also limit the amount of harm those patents could cause. The Patent Office does not (yet) have the power to get rid of software patents entirely, but it can fix the functional claiming problem." Read more of this story at Slashdot.     | | Microsoft Could Earn Billions From Office For iOS Feb 15th 2013, 16:33 Nerval's Lobster writes "Microsoft is leaving billions of dollars on the table by not porting Office to the iPad, according to a new analyst report. That analyst, Morgan Stanley's Adam Holt, believes that Office for iOS would sell to approximately 30 percent of all iPad users; priced at $60 per copy, that comes to a grand total of $2.5 billion per year — minus Apple's cut of the revenues, of course. But does Microsoft actually want Office for iOS out there? It's not necessarily in the company's best interest to rush such a platform to market, even if billions of dollars potentially hang in the balance — it's too busy pushing Office as a cloud-based, OS-agnostic platform. And Microsoft has another reason, aside from pushing the cloud version of Office, to de-emphasize the prospect of its productivity software on iOS: In a bid to draw more customers to its new hardware, Microsoft preloaded its Surface RT tablets with Office; offering the software on a rival touch-screen would take a major selling point off the table." Read more of this story at Slashdot.     | | WebKit As Broken As Older IE Versions? Feb 15th 2013, 15:51 An anonymous reader writes "It's not everyday that we get to hear about the potential downsides of using WebKit, but that's just what has happened as Dave Methvin, president of the jQuery foundation and a member of the core programming team that builds the widely used Web programming tool, lamented in a blog post yesterday. While most are happy to cheer for IE's demise, perhaps having three main browser engines is still a good thing. For those that work in the space, does the story ring true? Are we perhaps swearing at the wrong browser when implementing 'workarounds' for Firefox or IE?" Read more of this story at Slashdot.     | | Converting The Prototype: iOS Prototyping With Adobe Fireworks And TAP (Part 3) Feb 15th 2013, 15:34 In the previous parts of this tutorial (part 1 and part 2), we looked in detail at the building blocks of our design in Fireworks (pages, shared layers, symbols, styles), and we started to make a demo prototype in Fireworks. The demo prototype had six pages, linked together by hotspots, and each hotspot was customized for use with TAP. (Which page will the hotspot link to? Which gesture will initiate the hotspot link? Which transition will animate once the appropriate gesture is used?) Now that the six-page Fireworks PNG file is ready, it's time to prepare it to be exported as a click-through prototype and then converted (with the help of the TAP extension) to an animated, gesture-based prototype that we can use on an iOS device. Export The Fireworks Project Create the Project Folder First, we create the project's folder. This folder will contain and organize our Fireworks project, as well as the TAP assets needed to create the prototype: - Create the project's folder, and name it
CookbookApp. - In the folder, create another folder named
Library. When you export the project from Fireworks, you will export into the Library folder. TAP will always look for project files in the Library folder, and it will create and place your prototype files in the project's folder. If you forget to create a Library folder, Fireworks will remind you when you export the project. Export as LBI After you have created the project folder and have finished customizing all of your pages and hotspots, the next step is to export your Fireworks PNG in a format that TAP can understand. Ultimately, your work will be an HTML prototype (i.e. a set of HTML files) that can be viewed full screen on an iOS device; but because you will be using TAP to create the prototype, you cannot directly export to HTML in Fireworks. Instead, export the project as a Dreamweaver Library (.lbi file format). While this format cannot be read directly by a browser, TAP will convert the LBI into HTML through the use of custom-developed PHP and JavaScript (jQTouch and jQuery) code later on. Here are the steps: - Start with the menu
File → Export. - In the "Export" dialog box, use the following settings:
- In the "Save as" field, type
cookbook (the file extension is automatically added). - Navigate to the directory you wish to save your project to.
- The "Export" drop-down menu should be set to the Dreamweaver Library (LBI).
Note: If a warning dialog box appears, click "OK" and continue with the export:
Warning dialog box in Fireworks when saving for the first time in the LBI file format. - Create a new folder and name it "Library," and then click "Choose."
- In the "Pages" drop-down menu, select "All Pages."
- Enable the "Put Images in Subfolder" option.
- Finally, when ready, click the "Export" button.
The "Export" dialog box should look similar to the one below: 
Export your prototype as a Dreamweaver Library item (LBI) using the settings shown in the screenshot. The LBI file must be saved in a folder named "Library" in order for it to work properly.
Download TAP At this point, you have completed most of the hard work required to make the prototype come to life. You are almost ready to export your work, but before doing so, download the TAP utility. This is a ZIP file with some folders containing PHP, jQuery and jQTouch scripts. Unzip the file; note that one of these folders is named "Library," into which you will eventually copy (or directly export) your prototype's LBI files. Convert The Prototype Into A Working iOS Prototype Upload Your project is now uploaded to a Web server. Make sure that your Web server has PHP installed, because the TAP installation process requires it. First, we need to upload the TAP folder that we downloaded earlier (which now also has our project exported to the Library subfolder!) to a server that can execute PHP. Set File Permissions Next, to make TAP work correctly, we need to set the correct permissions (also known as CHMOD) to access the files and folders we have uploaded. You can set the file access properties using an FTP transfer program. No matter what software you use, the process is roughly the same. I use Transmit on the Mac, but you can use FileZilla (if you are on Windows) or another FTP client of your choice. In Transmit, CHMOD is accessed via the "Get info" command: 
Set up the file permissions so that everyone can read, write and execute them (known as "777" in the octal numeral system) to ensure that the prototype runs correctly.
Set the access to "777," either by typing 777 in the "Octal" field or by checking all of the boxes for "Read," "Write" and "Execute." Note that for the purpose of this article, these file permissions are for use on the remote server on which you will be hosting the prototype, not for use on a local server (although you could, of course, run TAP on a local server, as long as you have Apache and PHP running on your Mac or Windows machine). Convert to iOS Prototype The next step is to open up the dashboard where all of the settings are available to convert your project into a real HTML website (i.e. HTML prototype). First, load the "Build" panel in Safari on your iOS device by opening http://www.yourwebsite.com/path_to_prototype/foldername/build (see an example of a build panel). This step can also be done by loading the Build panel on a desktop machine, but it is still recommended that you use the Safari browser. 
TAP's Build panel (Larger version)
In the Build panel, you can configure the settings for the prototype. You can also upload the home-screen icon and the startup screen from here. To save your settings, click "Build prototype." If you have made any mistakes in the previous steps of this tutorial, the page will notify you with a warning at this point. If there are no errors, click the "Go there" link, which serves as a shortcut to the prototype. Note: You can also manually go to the website by typing in the following address: http://www.yourwebsite.com/path_to_prototype/foldername/. This is useful for when you are using the Build panel on a desktop to set up the prototype. You will see a black screen and maybe a brief flash of your website appear for a second, which is normal; this page is not yet your prototype. One final step is needed, although the step you take will depend on the browser you are using to view the prototype: - Safari
To actually see your prototype, you must add a bookmark for this page and add the bookmark to the home screen. - iCab Mobile
I have found that iCab Mobile is a better browser to showcase a prototype, because you can view it in full screen with no chrome, and also view it offline. (Details on using the browser will be shared later on.) Note: While iCab provides a more robust and sophisticated environment to work with your prototype, as of the time of writing, the newest version of iCab can't directly build the prototype. However, there is a workaround that allows you to use iCab. To use iCab, first open and run the Build panel in Safari. Once the "Build prototype" button has been pressed in Safari and the black screen appears with a brief flash of your prototype (as described earlier), you will be able to copy the URL into the address bar and then paste it into iCab Mobile. Icon and Startup Image Use the Build panel to upload the application's icon and the startup image (you can do this only in the Safari browser on a PC or Mac, not on an iOS device). It does not matter how these files are named. Putting them in the add-ons folder is recommended. Note that startup images do not load reliably for some reason. Sometimes they show up as the prototype is loading, and other times the startup image is skipped and the first page of the prototype is loaded instead. I am not sure why this happens, but whatever happens, your prototype will still load correctly. Remember that the startup images have certain dimensions. For example: - iPhone 3
320 × 460 pixels - iPhone 4 and 4s (Retina)
640 × 920 pixels - iPhone 5 (Retina)
640 × 1136 pixels - iPad 2
768 × 1024 pixels - iPad 3 (Retina)
1536 × 2048 pixels (The newest version of TAP, 0.47, officially supports all Retina display resolutions.) 
An example of an app icon that can be used when your HTML prototype is launched from the iOS home screen, to make it feel more like a real app.
Updating the Prototype When Changes Occur Here are the steps for updating the prototype if needed: - Make the changes in your Fireworks PNG document.
- Export the file again to the Dreamweaver Library format (LBI), and replace the folder on the server. (To be on the safe side, delete the folder on the server first and then upload the new folder.)
- Open the Build panel in your browser, and click "Build prototype."
- Add the prototype to the home screen of your iOS device.
- Launch the prototype from the home screen. Done!
Some Tips - When you are ready to export the new LBI files, delete all of the files in the "Library" folder before exporting from Fireworks. This will save you from having to OK a lot of messages later on.
- If you've fixed technical bugs in the prototype in Fireworks but don't see them updated in the browser, try clearing the browser's cache (the browser may be loading older cached files).
- Remember to rebuild new exports before testing changes in the browser.
Using the Prototype Recommended Browsers View the prototype that you export to your iOS device in the iCab Mobile browser, because it allows for full-screen viewing and offline Web caching. This makes for a reliable and more realistic experience when showing the work to clients. To view and test the prototype on a desktop computer, Apple's Safari browser (available for both Mac and Windows) is recommended. Keep in mind that, from time to time, the browser on a desktop computer might render things slightly different than on an iOS device (in one case, my computer's browser displayed a slide-in transition, whereas on the iPad a fade was displayed). In such instances, trust iOS' rendering because that is what TAP was designed for. Setting Up iCab Mobile's Full-Screen Mode Download iCab Mobile from the Appstore, and launch it. 
Below is an example of a full-screen set-up. To get there, tap the settings button (i.e. the gear icon in the upper-right corner). 
iCab settings
Configure the full-screen heads-up display (HUD) settings to match this screenshot, so that you can exit full screen without being distracted by extraneous buttons. You can experiment on the placement of the button to exit full screen if it is often accidentally pressed when users are testing the design.
Then, tap the button for the full-screen icon. Remove all buttons except for "Exit" (which returns the user to non-full-screen mode). To do this, click on the icon slot that you wish to change, and select none (represented by a -/- ) from the list of options to make that icon blank. Also, turn transparency all the way down to make this control as unobtrusive as possible. Set Up Offline Viewing If you want a bulletproof plan to show your prototype regardless of whether there is Wi-Fi or 3G access, then set up the HTML iOS prototype for offline viewing by saving it in iCab Mobile's cache. First, click the settings icon (the gear icon in the upper-right corner).
"General Settings" will automatically be selected. In the right pane, scroll down to the last section, and set the "Disk Cache" to 100 MB. This should be enough space for even the largest of prototypes (if this is the first time you are using iCab, click "Delete Disk Cache"). 
To set up iCab to for offline viewing, turn offline mode to "On," and set the disk cache to the highest amount, which is 100 MB.
Now that the cache has been set up, you'll need to create an offline bookmark to save the iOS prototype to the cache. Enter the URL of the page that you would like to bookmark, and then click on the "Send to" icon (i.e. the box with an arrow coming out of it). Next, select "Add to bookmarks," and turn on "Offline bookmarks" in the pop-over. 
To create an offline bookmark, turn on the "Offline bookmark" option.
Finally, click "Save." Viewing Your Bookmarks Offline By turning on offline mode, iCab Mobile will look for the cached offline bookmark, instead of going to the original online URL of your prototype. You need to explicitly switch on offline mode in the browser only when an active Internet connection is available but you still want to load the Web page offline from the cache. However, if no Internet connection is available (for instance, if airplane mode is on or no Wi-Fi or cellular connection is available), then iCab will automatically use offline mode, so you do not need to explicitly switch it on. Open an Offline Bookmark Tap the bookmarks icon to open the bookmarks pop-over. Then, click the "Offline" button next to the link that you want to browse offline. (Don't click the title of the bookmark, because that would instruct the browser to open it from an online connection, not from the cache.) 
Tapping the title of the bookmark will send you to the online version of the bookmark. Tapping the "Offline" button will send you to the saved offline version of your website via the cache.
When using offline mode, remember to set the cache to a larger size in the settings (bigger is better). If you add an offline bookmark, it will be saved to the cache; so, if you make changes or bug fixes to your website, remember to delete the cache and add the offline bookmark again so that the updated version will be loaded! Conclusion There are many ways to create wireframes, click-throughs and prototypes. In the end, what matters is that the process of creation is fast and accurate and that the output is of a high enough fidelity to generate the appropriate level of feedback. Having tried many programs to design iOS prototypes, I have found that using Adobe Fireworks in conjunction with TAP is the most efficient and effective method available. In Fireworks, I can quickly and easily draw whatever I've dreamed up, and the pages, shared layers, symbols and styles ensure that my prototype works as a cohesive system that can be easily updated when needed. Then, using TAP, I can bring my wireframes to life on an iOS device, using animated transitions initiated by gestures. If you haven't yet, try Adobe Fireworks together with TAP. The process of using Fireworks and TAP is so simple and fast that you will find you get feedback earlier in the design process and iterate with less effort than ever before, resulting in stronger and more refined designs. Further Resources The following articles, tutorials and video tutorials will help you get started with Adobe Fireworks. General articles about Adobe Fireworks: - "Adobe Fireworks for Beginners," MediaLoot
- "Getting Started: Understanding Adobe Fireworks," Jim Babbage, AdobeTV
- "Why Choose Fireworks?," Stéphane Bergeron, Pixelyzed
- "Adobe Fireworks 101, Part 1," Tom Green, Layers Magazine
- "Adobe Fireworks 101, Part 2," Tom Green, Layers Magazine
- "Rapid Prototyping With Adobe Fireworks," Danielle Beaumont, AdobeTV
- "Adobe Fireworks: The Things You Might Have Missed," Trevor McCauley
- "Developing a Design Workflow in Adobe Fireworks," Joshua Bullock, Smashing Magazine
- "Useful Fireworks Techniques and Features for Large Design Teams," Kris Niles, Smashing Magazine
- "Refining Your Design in Adobe Fireworks," Benjamin De Cock, Smashing Magazine
How Adobe Fireworks is used at Cooper (my place of work): Articles about Fireworks layers, pages and objects: Articles about Fireworks symbols and styles: Articles about prototyping and wireframing with Fireworks: - "Touch Application Prototypes (TAP) for iPhone and iPad, Using Adobe Fireworks.," UNITiD
- "Create Interactive Prototypes With Adobe Fireworks," André Reinegger, Smashing Magazine
- "Interactive Prototypes and Time-Savers With Adobe Fireworks," Trevor Kay, Smashing Magazine
- "Interaction Design and Rapid Prototyping With Fireworks," Dave Hogue, Adobe Developer Connection
- "Rapid Interactive Prototyping With HTML, CSS and JavaScript Using Fireworks and Dreamweaver," Dave Hogue and Mariano Ferrario, Adobe Developer Connection
- "Setting Up a Fireworks Web Design Mock-Up for CSS and Images Export," Michel Bozgounov, Adobe Developer Connection
Questions? I know this has been a lengthy read, but hopefully fun, too. Still, it's possible that I've missed some things, so I'd love to answer any questions you may have or hear your feedback about this technique of prototyping with Fireworks and TAP for iOS. (mb al)
© Shlomo Goltz for Smashing Magazine, 2013. | | Python Trademark At Risk In Europe Feb 15th 2013, 15:10 mvar writes "A company in the UK is trying to trademark the 'Python' term for all things computing. The Python Software Foundation is asking for help. According to the PSF, they contacted the company in order to settle the matter but 'They blew us off and responded by filing the community trademark application claiming the exclusive right to use "Python" for software, servers, and web services — everywhere in Europe.' They now seek help from the community in several ways: By sending a letter to the EU council if you happen to work on a company that uses the Python programming language, by providing EU-published material regarding the Python language (articles etc) and/or financially supporting the PSF in the upcoming legal battle." Read more of this story at Slashdot.     | | CNN Replicates John Broder's Drive In the Tesla Model S Feb 15th 2013, 14:28 karlnyberg writes "Adding a third voice to the conflict between Tesla's Elon Musk and New York Times Reporter John Broder, CNN/Money's Peter Valdes-Dapena drove from DC to Boston (primarily to test the SuperCharger network). As he says in the article: In the end, I made it — and it wasn't that hard. ... As for the Supercharger network? Turns out that works, too.' He expands on this a bit: 'Looking back on the trip, it would be even easier if Tesla would install one of their fast-charging Superchargers along the New Jersey Turnpike. (These charging stations can fill up a nearly dead battery in Tesla's longest-range cars in about an hour, which is enough time to stop for a meal.) Tesla's working on that, spokeswoman Shanna Hendricks said. But the first priority was to install enough to make this trip, even if you had to take it easy most of the way. But I didn't have to take it that easy, which is good because the Model S provides a pretty amazing mix of smooth and silent performance along with brain-squishing acceleration. So even if you're not driving from Washington to Boston, it's an impressive car, all on its own.'" Read more of this story at Slashdot.     | | Congress Takes Up Online Sales Tax Feb 15th 2013, 13:47 head_dunce writes "A bill introduced Thursday by a bipartisan group of U.S. lawmakers seeks to make it easier for states to collect sales taxes stemming from online purchases. Amazon is among the e-retailers supporting the proposal, while a lobbying group representing eBay and Overstock.com stands opposed. From the article: '"Small businesses and states alike are suffering from the inability to collect due -- not new -- taxes from purchases made online," said Rep. Steve Womack, R-Ark., adding the legislation is a "bipartisan, bicameral, common-sense solution that promotes states' rights and levels the playing field for our Main Street businesses."'" Read more of this story at Slashdot.     | | Huge Meteor Blazes Across Sky Over Russia; Hundreds Injured Feb 15th 2013, 12:35 New submitter dovf writes "The Bad Astronomer analyzes incoming reports about the apparent meteoric fireball over Russia: 'Apparently, at about 09:30 local time, a very big meteor burned up over Chelyabinsk, a city in Russia just east of the Ural mountains, and about 1500 kilometers east of Moscow. The fireball was incredibly bright, rivaling the Sun! There was a pretty big sonic boom from the fireball, which set off car alarms and shattered windows. I'm seeing some reports of many people injured (by shattered glass blown out by the shock wave). I'm also seeing reports that some pieces have fallen to the ground, but again as I write this those are unconfirmed." This is the best summary I've found so far, and links to lots of videos and images. He also clarifies something I've been wondering about: 'This is almost certainly unrelated to the asteroid 2012 DA14 that will pass on Friday.'" Read more of this story at Slashdot.     | | Mechanism Of Action And Effects: Designing Great Feedback Loops Feb 15th 2013, 12:23 The products we build are full of feedback loops, whether we know it or not. People who study human behavior agree that feedback loops play a critical role in what we do. From biofeedback to the quantified self, designers and psychologists alike are discovering the real power that these cyclical interactions play in shaping our day-to-day choices. Designing for behavior change can increase user engagement, create business value and improve lives. Whatever you're designing, it probably involves feedback. Designing that feedback to be as effective as possible can mean the difference between a successful and failed product. This article discusses how to influence behavior by designing well-crafted feedback loops. What They Are, And Where They Live Feedback loops consist of a few simple steps: - A person takes an action,
- The action has one or more effects,
- The important effects of this action are presented back to the person,
- This loop is repeated regularly.
There are many natural feedback loops. They reveal to people whether they are making good or bad choices, and people learn from them. If someone eats something bad, they get sick. If they eat something good, it is delicious. If a person is nice to someone, and that someone responds in kind, the person feels good. If someone damages their body, it hurts. The brain has systems of reward and punishment that support basic survival. There are now many man-made examples of these as well. People take tests on their knowledge and receive a grade. They post a status update to Facebook and get rewarded when people like or comment on it. "Post more stuff like this," the feedback seems to say. So, let's dive into improving our own feedback loops! Discover Your Product's Basic Feedback Loops The first step is to identify your product's feedback loops. What are the fundamental repeated behaviors that your users engage in? 
Many social apps share the following basic loop: a user posts something, people see it, people click a button to "like" it, and the likes are presented back to the user. Email has a strong, simple loop: log in, see new emails, deal with the emails. 
The social apps Instagram, Facebook and Twitter all have feedback loops.
But they can also be harder to see. Yelp has built great feedback loops around local reviews. A restaurant provides food and services, and better services lead to better reviews. Meanwhile, customers dine in and leave reviews, which themselves are reviewed in turn by other people (see those "Useful," "Funny" and "Cool" buttons). Some people who leave enough reviews can get invited to special parties and more ("Yelp Elites"). These loops are purposefully designed: they drive people to engage with the website and to contribute content that is valuable to Yelp's business. 
My Yelp profile, with prominent feedback.
Look for patterns of repeated behavior, and list the ones you find. These behaviors could span time, digital and physical space, channels of communication, and even different people. Look closely at user actions that trigger a notification sent to them or others. Investigate places where users communicate with each other or with employees, either directly or indirectly. These areas are fertile ground for feedback loops, and you should be able to draw up a robust list without much effort. Understand How These Loops Are Broken, And Fix Them Now that you have a list of areas that can be improved, identify the most important or common ones in your product. They can be improved in any one of these aspects: - Speed,
- Measurability,
- Context,
- Connection to motivations.
1. Speed “It's too slow!” Problem: The longer it takes for feedback to arrive, the less it will influence future decisions. In operant conditioning, this is called "immediacy," and it's also related to "hyperbolic discounting." For example, when the user of a financial website makes an investment, seeing the outcomes of that investment could take years. Without any simulation of what their investment's growth might look like, they have little emotional material to support that decision. 
Solution: Tighten the feedback loop by presenting effects as soon as possible. This could entail revealing real effects, or simply simulating them. As long as they're grounded in reality, they will have influence. Even presenting simulated feedback right before someone makes a decision is effective. Knowing that an investment will likely earn them $1,000 will help the user feel good about making that decision. On ReadyForZero, our tool to help people organize and pay off debt, we enable the user to simulate the impact of different payment plans in real time, instantly revealing an outcome that could happen years from now. 
ReadyForZero simulates the impact of a payment plan in real time.
Smartphone push notifications have also gone a long way to giving immediate feedback. Posting something to Instagram, Facebook, Twitter and so on and then hearing one's phone buzz with social feedback within minutes is a powerful loop. Always be sure to use push notifications when appropriate. Credit cards provide a physical example of how delayed feedback can make for a dark pattern that drives harmful behavior. These cards have made banks huge amounts of money by alleviating a painful loop: pulling out your wallet and handing over your hard-earned cash. The more cash you spend, the more it disappears from your wallet. Soon, you are forced to go to the bank to get more, making you physically see and feel the effects of spending. Credit cards effectively delay the feedback on how much you spend until you bother to check the balance or are sent a bill at the end of the month. Even then, you have the option of delaying payment of the full balance (accruing interest in the meantime). This makes sliding into debt very easy. 2. Measurability “How does it compare?” Problem: Comparing vague, unquantifiable feedback to other factors in order to make an informed decision is too difficult. Take nutrition, a notoriously vague problem space for feedback. How do people know whether they're eating well? If they've heard that the thing they're eating is unhealthy, how unhealthy is it? If the feedback is presented in some quantifiable way that relates to reality, it will be easier to understand and the person's decisions will be more informed. Nutrition labels have made the effects of food more measurable. Now, someone can actually quantify the benefit of eating an apple, and the problem with eating a pile of bacon. 
Solution: As nutrition labels have done for food, give quantifiable feedback to users. Use visual comparisons as well, when possible. The human brain is great with tangible comparisons between the sizes, locations and other variables of objects. Read up on the framing effect as well as anchoring for more on the psychological reasons for why this works. Klout is attempting to make social influence measurable with its Klout score. It demonstrates the power of making things measurable, enabling users to objectively compare the online social influence of different people. It also highlights the risks of creating metrics where there were none before. The Klout score is interesting, but it's based on a limited set of social signals, such as followers, likes, replies, retweets and comments. Metrics must be believable and must accurately reflect reality, a hard thing to accomplish with social influence. 
My Klout score changes over time based on social interactions.
A lesson we've learned about measurability at ReadyForZero is to use numbers that are at a scale that people deal with in real life, typically up to 100. Telling a user that their debt will cost them $150,000 in interest means almost nothing to them other than "a lot of money" and isn't that useful. Instead, we focus on how much someone's debt costs them in interest every day, because this number tends to be in the $1 to $30 range and is comparable to many things they purchase daily, such as coffee and meals. Feeling good about their progress has helped our users significantly. 3. Context “What does it mean?” Problem: Feedback presented without the context of a larger goal isn't as effective. Saving some extra money can make someone feel good. But saving towards a goal is more meaningful. "This deposit of $500 has put me one third of the way towards my vacation." Providing context for the feedback not only creates a signpost by which to measure progress, but actually frames the way people think about a problem. For example, "You've spent $1,200 this week" is a very different way to frame one's finances than "You've spent $1,200 of your budgeted $700 this week," even though they represent the same data. 
Solution: Frame effects in the context of user goals. How much closer to or further from a goal has this action taken the user? On ReadyForZero, we show the amount of time and interest saved by making a big payment towards a debt, and the amount lost by buying things on a credit card. This is a form of "anchoring." By showing a desired goal, you've set the anchor by which the user can then evaluate their current situation. If they have not yet reached the goal, they'll feel the tension of wanting to reach it. The Nike+ Fuelband, along with many other quantified-self activity-tracking devices, explicitly creates feedback loops and goals around user behavior where there were none before. The user's physical activity is tracked and reported throughout the day, compared to goals, and shared online. Note the strong use of progress bars, both on the watch and in the app, which communicate how close the user is to reaching their daily goal. 
The Nike+ Fuelband shows daily activity relative to goals.
4. Motivations “I don't care.” Problem: Feedback that isn't connected to the user's true motivations doesn't work sustainably. "Gamified" feedback loops are able to make an impact, but points and badges that don't connect to anything meaningful won't last. People don't care about points; they care about things such as health, happiness, friendship and wealth. Right now, which would you rather have: 30 Foursquare points, 30 likes on your next Facebook update, 30 extra minutes in your day or $30? The answers may vary, but I'll bet the Foursquare points would be last on the list for everyone. 
Solution: Discover what your users care about, give them the ability to reach those goals, and present feedback connected to that. Social rewards, such as comments on our thoughts and photos, connect to the need for human relationships. Feeling fit and looking great connects to the goal of being healthy. Money connects to the many things people spend it on. On ReadyForZero, we help people pay down their debt by showing them a number of bits of important feedback. First, we tangibly show the progress that a potential payment would make towards their goal on a progress bar. The visual connection enhances the feeling of achievement. Secondly, we tell them the long-term implications of that payment in terms of interest and time saved. 
ReadyForZero shows the impact of a payment to credit-card debt, including real time and money saved.
Fully grasping what your users' motivations are can be difficult. There are many theories about how motivation works, each with implications for design. A useful framework is the theory of self determination, which posits that people who have most of their basic needs met can begin to look for autonomy, relatedness and competence. The theory is that these motivations arise not from the outside world, but from inside, and are more powerful. Theory aside, however, the tried and true approach of speaking candidly and in depth with your users will reveal what they truly care about. Two Things To Remember With these categories in focus, you're on your way to designing better feedback loops. However, keep two things in mind as you go. 1. Measure Your Success Now that you've identified your areas for improvement and made changes to them based on our criteria, it's important to measure the outcomes of these changes using analytics and user research. As stated, you can't improve what you can't measure. 
Analytics and research are, in fact, your own internal feedback loop as a designer. Consider the key metrics to track and report, how often they are reported, and in what context. The design of this feedback loop will affect how you respond to user behavior, and it's important that your team is optimizing for the right things. 2. Be Ethical Finally, throughout the process, evaluate the ethics involved in each decision. The power of behavioral techniques should always inspire a discussion within your team as well as within yourself. Are you designing a health improvement app, a utility or a slot machine? Which of these is acceptable? Taking responsibility for influencing behavior requires a strong moral compass. Products that have taken the low road have been both successful and harmful. Zynga has created a business model around extremely effective feedback loops, but the values informing many of these loops have been routinely criticized as being unethical. For example, Zynga uses progress bars, goals, levels and social pressures very effectively to monetize its signature game, Farmville. However, such games arguably succeed at the expense of the user's time, cash and creativity. They focus on achieving business goals by manipulating user emotions. 
Cityville, another popular Zynga game, uses progress bars, levels and cleverly timed loops to drive engagement.
Defining "fun" is beyond the scope of this article, but the clever timing of cash-based advances in gameplay is clearly designed for profit rather than for the player's experience. Read about the fascinating Cow Clicker saga for an amusing critique of this model. For a more rational approach to designing ethically, review Stephen Anderson's guidelines, which take a deeper look at how to calibrate your moral compass. In general, use the golden rule, and try to make the world a better place for everyone. In Summary Design can be used to nudge behavior, and great feedback loops are a vital piece of pulling it off. Assist your users in understanding and achieving their goals by continually optimizing your feedback loops. Focus on making them fast, meaningful, quantified and contextual, and your users will thank you for improving their lives. (al)
© Loren Baxter for Smashing Magazine, 2013. | | Australian Federal Court Rules For Patent Over Breast Cancer Gene Feb 15th 2013, 10:31 Bulldust writes "The Federal Court in Australia has ruled in favor of U.S. biotechnology company Myriad Genetics, enabling them to continue to hold the patent over the so-called breast cancer gene BRCA1. The same patent is also being reconsidered by the U.S. Supreme Court in the current session. From the article: 'Federal court Justice John Nicholas has ruled that a private company can continue to hold a patent over the so-called breast cancer gene BRCA1, in a decision that has devastated cancer victims.The decision is the first in Australia to rule on whether isolated genes can be patented, and will set a precedent in favor of commercial ownership of genetic material.'" Read more of this story at Slashdot.     | | Can You Potty Train a Cow? Feb 15th 2013, 08:58 sciencehabit writes "Think potty training a child is hard? Try teaching a cow when and where to do its business. The bovines can defecate nine to 16 times daily, creating big hygiene problems on dairy and beef farms. So cueing the animals to go in the right place would be a big help for managing manure. But past techniques—including training cows to respond to mild electric shocks—have proven ineffective or impractical for wide use. To see if they could come up with a better potty prompt, scientists tested a series of stimuli on a dozen Holstein cows. The milkers stood in or walked through a footbath filled with water, for example, or had air or water sprayed on their feet. Alas, '[n]one of our tests reliably stimulated defecation,' the team reports." Read more of this story at Slashdot.     | | First Bionic Eye Gets FDA Blessing Feb 15th 2013, 08:04 coondoggie writes "The U.S. Food and Drug Administration today approved what it says is the first bionic eye, or retinal prosthesis, that can partially restore the sight of blind individuals after surgical implantation. The Argus II Retinal Prosthesis System includes a small video camera, transmitter mounted on a pair of eyeglasses, video processing unit (VPU) and an implanted artificial retina. The VPU transforms images from the video camera into electronic data that is wirelessly transmitted to the retinal prosthesis." Read more of this story at Slashdot.     | | 100% Open Source, Next Gen Discussion Platform Feb 15th 2013, 07:05 
Advertise here via BSA Discourse is the 100% open source, next-generation discussion platform. You should consider using Discourse when you need a mailing list, a forum to discuss something, and a chat room where you can type paragraphs. Discourse is a from-scratch reboot, an attempt to reimagine what a modern, sustainable, fully open-source Internet discussion platform should be today. They tried to build the community that has a natural immune system to defend itself from trolls, bad actors, and spammers. There’s also a trust system, so engaged community members can assist in the governance of their community. The act of participating in a discussion should fundamentally feel good in a way that it currently does not on all existing forums and mailing lists. It should be fun to have discussions with other human beings, not a chore, or something that’s barely tolerable. 
Requirements: PostgreSQL 9.1+, Redis 2+
Demo: http://www.discourse.org/
License: GPL License
SponsorsProfessional Web Icons for Your Websites and Applications  | | Quickstart: Adding HTML Controls in Windows Store App Feb 15th 2013, 07:01 
Advertise here via BSA Every app needs controls, such as buttons, check boxes, and drop-down lists. Windows Store apps built for Windows using JavaScript can use two types of controls: intrinsic HTML controls and Windows Library for JavaScript controls. Intrinsic HTML controls are those controls, such as buttons and check boxes, that are a part of the HTML standard. 
Here we focus on how to create and use HTML controls. The next topic, Quickstart: Adding WinJS controls and styles, describes how to create and use Windows Library for JavaScript controls. Prerequisites We assume that you can create a basic Windows Store app using JavaScript that uses the Windows Library for JavaScript template. For help creating your first app, see Create your first Windows Store app using JavaScript. What is a control? In many application programming models, you need a control to display or interact with content. Because most HTML elements are capable of displaying content and responding to a variety of events, the distinction between a control and an element isn’t always clear for Windows Store apps using JavaScript. We refer to elements and objects whose primary purpose is to provide interactivity as controls. For a list of elements and objects that fall into this category, see Controls by function. Adding an HTML control You can use any HTML control in your Windows Store app using JavaScript. To add an HTML control To add an HTML control, just add the control’s HTML to your page, like you would for a typical web page. This example creates a button: <button id="button1">An HTML Button</button> It’s generally a good idea to assign an ID or class name to your control so that you can easily retrieve and manipulate it. Later, when we show you how to attach events, you’ll use the button’s ID to find the button. The HTML for a control isn’t always as straightforward as it is for a button. For example, to create a slider control, you use the input input element: <input type="range" /> For a list of available HTML controls and the markup you use to create them, see the Controls list. Handling events Every control provides events that enable you to respond to actions from the user. For example, the button control provides a click event that is raised when a user clicks the button. You create a function, called an event handler, to handle the event and then you register the event handler with the control. There are two ways to register an event handler. One way is to add an event handler in your HTML by setting the control’s event attribute to the name of a JavaScript event handler function or a JavaScript statement. For more info about this approach, see the Why you shouldn’t set an event handler in markup section. The other way to add an event handler is to add it programmatically. This is the approach we recommend. To register an event handler programmatically 1. Create the control and assign it an ID. This example creates a button and gives it the ID “button1″. <button id="button1">An HTML button</button> 2. Just for this example, create a paragraph element and assign the ID “button1Output”. You’ll use it to display info about the button’s click event. <p id="button1Output"></p> 3. In your JavaScript code, define an event handler. Most event handlers take a single argument, an Event object that contains info about the event. Other events might return other types of event info objects that provide info specific for that event. The click event provides a MouseEvent object that contains info about the event, such as which mouse button was pressed and which object fired the event. This example creates a click event handler that uses the MouseEvent object to obtain the x- and y-coordinates of the point that the user clicked. (The click event also responds to touch and keyboard interaction. The examples in this topic assume that the user is clicking with a mouse. For more info about interacting with touch and different devices, see Responding to user interaction.) function button1Click(mouseEvent) { var button1Output = document.getElementById("button1Output"); button1Output.innerText = mouseEvent.type + ": (" + mouseEvent.clientX + "," + mouseEvent.clientY + ")"; } 4. Now you need to attach the event to your control by retrieving it and calling addEventListener. The question is, when should you retrieve the control? You could just add it anywhere to your JavaScript code, but then there’s a chance it might get called before the control exists. If you’re adding the control to your app’s start page, which is defined by default.html and default.js, use the WinJS.UI.processAll function to register your event handlers. Each Microsoft Visual Studio Express 2012 for Windows 8 template creates a default.js file that calls WinJS.UI.processAll in the activated event handler. Because it’s an asynchronous method, the WinJS.UI.processAll method returns a Promise. To attach your event handlers, provide a then or done function for the Promise that WinJS.UI.processAll returns and use that function to attach your event handlers. (For more info about promises, see Asynchronous programming in JavaScript.) This example uses WinJS.UI.processAll to attach the button’s event handler. (function () { "use strict"; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; WinJS.strictProcessing(); app.onactivated = function (args) { if (args.detail.kind === activation.ActivationKind.launch) { if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) { // TODO: This application has been newly launched. Initialize // your application here. } else { // TODO: This application has been reactivated from suspension. // Restore application state here. } args.setPromise(WinJS.UI.processAll().done(function () { var button1 = document.getElementById("button1"); button1.addEventListener("click", button1Click, false); }) ); } }; app.oncheckpoint = function (args) { // TODO: This application is about to be suspended. Save any state // that needs to persist across suspensions here. You might use the // WinJS.Application.sessionState object, which is automatically // saved and restored across suspension. If you need to complete an // asynchronous operation before your application is suspended, call // args.setPromise(). }; // The click event handler for button1 function button1Click(mouseEvent) { var button1Output = document.getElementById("button1Output"); button1Output.innerText = mouseEvent.type + ": (" + mouseEvent.clientX + "," + mouseEvent.clientY + ")"; } app.start(); })(); For more info about the WinJS.UI.processAll method, see Quickstart: adding WinJS controls and styles. If you’re adding your control to a Page control, use the Page control’s ready function to attach your event handlers. The Windows Library for JavaScript Page control provides a way to divide your content into modular, reusable units. Your app might contain one or more Page controls automatically, depending on which Visual Studio Express 2012 for Windows 8 template you used to create it. When you create a Page control, it automatically includes a ready function that you can use to add an event handler for your button. This example shows the complete JavaScript code for a Page control that adds a click event handler to a button. // htmlControlExample.js (function () { "use strict"; function button1Click(mouseEvent) { var button1Output = document.getElementById("button1Output"); button1Output.innerText = mouseEvent.type + ": (" + mouseEvent.clientX + "," + mouseEvent.clientY + ")"; } // This function is called whenever a user navigates to this page. It // populates the page elements with the app's data. function ready(element, options) { var button1 = element.querySelector("#button1"); button1.addEventListener("click", button1Click, false); } function updateLayout(element, viewState) { // Respond to changes in the viewState. } WinJS.UI.Pages.define("/html/htmlControlExample.html", { ready: ready, updateLayout: updateLayout }); })(); For more info about Page controls, see Adding Page controls. If you’re adding the control to your own custom HTML and JavaScript files, handle the DOMContentLoaded event and use it to call WinJS.UI.processAll. You can register for the DOMContentLoaded event anywhere in your code, because the document object already exists by the time your code executes. Provide a then or done function for the Promise returned by WinJS.UI.processAll and use that function to attach your event handlers. When you run the app and click the button, it displays the coordinates of the click point. Why you shouldn’t set an event handler in markup You can add event handlers in your markup, but in some ways it can be more complicated than adding them with the addEventListener method because of scoping issues. When you use Visual Studio Express 2012 for Windows 8 to create a new Windows Store app using JavaScript Blank Application, it creates this default.js file: (function () { "use strict"; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; WinJS.strictProcessing(); app.onactivated = function (args) { if (args.detail.kind === activation.ActivationKind.launch) { if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) { // TODO: This application has been newly launched. Initialize // your application here. } else { // TODO: This application has been reactivated from suspension. // Restore application state here. } args.setPromise(WinJS.UI.processAll()); } }; app.oncheckpoint = function (args) { // TODO: This application is about to be suspended. Save any state // that needs to persist across suspensions here. You might use the // WinJS.Application.sessionState object, which is automatically // saved and restored across suspension. If you need to complete an // asynchronous operation before your application is suspended, call // args.setPromise(). }; app.start(); })(); All code is wrapped in an anonymous global function. Wrapping your code in an anonymous global function is a good coding practice because it limits the scope of your code and avoids polluting the global namespace. If you add the event handler described earlier, the code behind file looks like this: (function () { "use strict"; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; WinJS.strictProcessing(); app.onactivated = function (args) { if (args.detail.kind === activation.ActivationKind.launch) { if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) { // TODO: This application has been newly launched. Initialize // your application here. } else { // TODO: This application has been reactivated from suspension. // Restore application state here. } args.setPromise(WinJS.UI.processAll()); } }; app.oncheckpoint = function (args) { // TODO: This application is about to be suspended. Save any state // that needs to persist across suspensions here. You might use the // WinJS.Application.sessionState object, which is automatically // saved and restored across suspension. If you need to complete an // asynchronous operation before your application is suspended, call // args.setPromise(). }; function button1Click(mouseEvent) { var button1Output = document.getElementById("button1Output"); button1Output.innerText = mouseEvent.type + ": (" + mouseEvent.clientX + "," + mouseEvent.clientY + ")"; } app.start(); })(); If you set the event handler in markup instead of in your code, the button from the earlier examples would look like this: <button id="button1" onclick="button1Click(event)">An HTML button</button> When you run the app and click the button, nothing happens. That’s because the button1Click function is wrapped in an anonymous function and isn’t directly accessible to your markup. For your code to work, you’d need to move button1Click outside the anonymous function. (function () { "use strict"; var app = WinJS.Application; var activation = Windows.ApplicationModel.Activation; WinJS.strictProcessing(); app.onactivated = function (args) { if (args.detail.kind === activation.ActivationKind.launch) { if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) { // TODO: This application has been newly launched. Initialize // your application here. } else { // TODO: This application has been reactivated from suspension. // Restore application state here. } args.setPromise(WinJS.UI.processAll()); } }; app.oncheckpoint = function (args) { // TODO: This application is about to be suspended. Save any state // that needs to persist across suspensions here. You might use the // WinJS.Application.sessionState object, which is automatically // saved and restored across suspension. If you need to complete an // asynchronous operation before your application is suspended, call // args.setPromise(). }; app.start(); })(); function button1Click(mouseEvent) { var button1Output = document.getElementById("button1Output"); button1Output.innerText = mouseEvent.type + ": (" + mouseEvent.clientX + "," + mouseEvent.clientY + ")"; } But now button1Click is global, which is not what we want. You could move the button1Click definition back inside the anonymous function and then use WinJS.Namespace.define to make it publicly accessible (for an example of how to do this, see Coding basic apps). This is a better approach, but there are still reasons to avoid attaching event handlers in markup. For one, the event info passed to the handler isn’t as useful. When you use addEventListener to attach the event, the mouseEvent.target property returns a reference to the button, but when you set the event handler in markup, the target is the window object instead. For these reasons (and more), it’s better to use addEventListener to attach event handlers. Remarks Don’t use JavaScript URIs Don’t use JavaScript URIs in your event handler because your app won’t execute them. For example, if you try this, nothing happens when you click the button: <button id="button1" onclick="javascript: 2 + 2;">An HTML Button</button> This restriction applies to code in the app’s local context (code included in your app package), but doesn’t apply to code on external web pages accessed by your app. Using <form> tag In a traditional HTML website, controls and other input elements are usually contained in a form element. form elements are used to pass data to the server. Because most programming for a typical app is client-based, you don’t usually need to use a form element. Using transparent layers It’s common practice to use a full screen transparent layer, such as an empty div element, to detect certain user interactions or to display animations. However, covering an HTML control with a transparent layer can make it less responsive to user interaction. To keep your HTML controls responsive, don’t put a transparent layer over them. Summary and next steps We've seen how to create HTML controls and how to attach event handlers. Next, learn how to use the new Windows Library for JavaScript controls provided for Windows Store apps using JavaScript by reading Quickstart: adding WinJS controls and styles. To learn more about specific controls, see the Controls list. Samples Basic controls sample
Shows examples of many HTML and Windows Library for JavaScript controls. This tutorial is brought to you by the team at MSDN. To learn more about coding for Windows Store apps, please visit http://dev.windows.com SponsorsProfessional Web Icons for Your Websites and Applications  | | Could New York City Cut Emissions 90% By 2050? Feb 15th 2013, 05:32 First time accepted submitter jscheib writes "According to Will Oremus in Slate, a report released today finds that 'New York City could slash its emissions by a whopping 90 percent by 2050 without any radical new technologies, without cutting back on creature comforts, and maybe even without breaking its budget.' The key elements are insulating buildings to cut energy needs, converting to (mostly) electric equipment, and then using carbon-free electricity to supply the small amount of energy still needed. Oremus notes that including energy savings would reduce the net price tag to something more like $20 billion." Read more of this story at Slashdot.     | | NY Times' Broder Responds To Tesla's Elon Musk Feb 15th 2013, 03:11 DocJohn writes "NY Times' John Broder responded to Elon Musk's blog entry. Accused of driving around a parking lot for no reason, for instance, Broder notes he was simply looking for the poorly marked charging station. Worst of all, much of Broder's behavior can be attributed directly to advice he received from Tesla representatives — something Musk fails to mention." Read more of this story at Slashdot.     | |
