Scott Hanselman

Scott's Wonderful Twitter Favorites - Link Roundup 2

July 21, 2011 Comment on this post [0] Posted in Blogging
Sponsored By

showhero[1]I realize that many (most) of you are not on Twitter. I am, however, on Twitter and I find it to be a joy. I have had a few complaints (just a few) because I tend to be random on Twitter. If you want only a stream of technical .NET resources, then don't follow me. However, if you want to follow the Whole Person, then please, join the fun.

The most wonderful part of Twitter is just letting it flow over you. I tend to discover lots of interesting and cool stuff. So much so that I've started "Favorite-ing" things I want to save for later. That means clicking the little Star icon. You can access any Twitter user's favorites by putting /favorites at the end of their URL, like http://twitter.com/shanselman/favorites. There are 3rd parties like FavStar that mine this information, both favorites (stars) and retweets (RTs) and then sort by popularity. You can see my most "popular" tweets here: http://favstar.fm/users/shanselman. These tend of be ones that folks want to save for later themselves.

So far I've blogged:

For the people that aren't on Twitter (or aren't on it as much as I am) I thought I'd do a post each week or so with a roundup of the most awesome links I've come upon that week on Twitter. One stop shopping for awesome. I'll also add some commentary about why it's awesome. These aren't all development centric, but they were interesting to me.


mrated: MetroTwit Show is mesmerizing. I can see it being used at trade shows and whatnot. Well done @longzheng and Co! http://is.gd/hWo0so

MetroTwit is a great Twitter client for Windows, and MetroTwit Show is kind of a Twitter client screensaver. It's fun to watch the tweets just move around and come and go. I think it'd be great for an office lobby of a company, or a conference! Really nice visualizations.


hugorodgerbrown: the current answers to this question are effectively parking a tank on your lawn -http://t.co/gFOHrBM "If licensing were free, what would be the downsides of using the Microsoft stack for a website?"

This twitter follower tweeted me to let me know an interesting discussion was happening on Quora, a Q&A site. While I didn't feel it was a "tank on my lawn," it did turn into a really good, constructive discussion about choosing a stack, AND I learned more about Quora.

image


rupl developer prank - Put this in your co-worker's user stylesheet: * {-webkit-transform: rotateZ(-.1deg); }

This is evil. If you want to really confuse a developer or designer, hide this line in their stylesheet and see if they figure out why things aren't "pixel perfect" anymore!


redditflipboard Putting on her serious face.: #reddit #flipboard http://bit.ly/o7snxB

You may hate animated gifs, but they are BACK and Twitter is full of them. Such old school fun! I'm starting to collect them again and throw them into DropBox. As Jeff Atwood says, "There is no problem animated GIFs cannot solve."

1cWSZ[1] 


Carnage4Life Nerdy proposals make me cry :) http://juliewillyoumarry.me/

This is a great little website and a video of the actual proposal. So clever. Of course, thanks to the ubiquity of the Internet, no one can ever do it again. Or dance in to Chris Brown's "Forever."

image


TheWordsmith215 "What you're comfortable with isn't the only thing you're good at." ~@markchappelle

Yes, Twitter is also filled with pithy quotes, but sometimes that's exactly what you need to hear.


codinghorror How much should you pay developers? http://t.co/zZnLcGm

Jeff Atwood blogs the Stack Exchange Developer Compensation document externally. While no actual numbers appear, it's still interesting to see what Jeff and Joel and friends value in an employee, including Modem Whistling.


GeeDee215 Make Your Kid A Writer http://t.co/LfOY2UZ

I would love for my kid to be a writer. Here's some tips from The Atlantic via Molly Backes:

Give her a notebook and five bucks so she can pick out a great pen. Insist she spend time with the family. It's even better if this time is spent in another state, a cabin in the woods, a cottage on the lake, far from her friends and people her own age. Give her some tedious chores to do. Make her mow the lawn, do the dishes by hand, paint the garage. Make her go on long walks with you and tell her you just want to listen to the sounds of the neighborhood.

Let her be lonely. Let her believe that no one in the world truly understands her. Give her the freedom to fall in love with the wrong person, to lose her heart, to have it smashed and abused and broken. Occasionally be too busy to listen, be distracted by other things, have your nose in a great book, be gone with your own friends. Let her have secrets. Let her have her own folder on the family computer


jonubian Being able to admit fault, accept accountability, and apologize is some high power s***

My twitter friend Jo breaks it straight down. This is the kind of quote I consider printing out, laminating and framing on my wall.


For more details on Twitter and my tips and tricks, I hope you'll enjoy these blog posts...

Related Links

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Fanciful names and acronyms often create LIFE

July 21, 2011 Comment on this post [24] Posted in Musings
Sponsored By

I was speaking with some folks at an unnamed technology company today about product names, and in a follow up email someone referenced a document that said:

Spell out the full name and use the acronym sparingly, so customers are able to clearly identify what it means. Fanciful names and acronyms often create confusion.

I jumped up on my desk and began ranting, if you can imagine. Here's some of the results of my rant. No blood was spilled. Well, a little.

Sugar Umbraco Node JS
Cucumber Raphael Glimpse
Wijmo Mochikit MooTools
Prototype Entity Framework Magic Unicorn Edition  Amplify JS
Kinect Skype NuGet 
Ninject Android Lync

What would you add, Dear Reader? What "fanciful product names" give you life?

Give me your suggestions, and I'll add them if they are LIFE!!!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

The Guide to Creating Quality Technical Screencasts

July 20, 2011 Comment on this post [17] Posted in Musings | Tools
Sponsored By

Screenshot of ScreencastI've had lots of people ask me to write up a guide to creating great technical screencasts. Here it is.

Initial Setup and Tools

You can use any number of tools for screen capture. They are largely the same. My preferred tool is Camtasia. Other valid tools are CamStudio (a free and open source tool) and Expression Encoder Screen Capture.

Windows Look and Feel

At the risk of sounding uptight, how you setup Windows and your environment is the difference between a professional and an amateurish screencast. It's shocking how many folks will start recording a screencast without changing a thing, then wonder why their 1600x1200 screencast looks bad on YouTube at 360p. If you find yourself doing screencasts a lot, considering making a Screencast user on your machine with these settings already applied.

Aspect Ratio and Resolution

First, decide on your aspect ratio. Is this a 4:3 Square (mostly) screencast or a 16:9 Widescreen screencast? Use 1024x768 for 4:3 and 1280x720 for 16:9. Run with normal 96dpi fonts.

If you're running a VM in a Window, that's cool, but really do take the time to resize it to exactly 1024x768. It can be maddening, especially with Virtual PC, but just do it. Then us the screencast software to record exactly a square of 1024x768

Background Wallpaper and Icons

Choose a standard looking background photo. I prefer to use one from http://www.vs2010wallpapers.com or the defaults that come with Windows 7. Avoid complex backgrounds as they don't compress well during encoding.

Hide your icons. Right click your desktop and hit View | Show Desktop Items. You can also use Stardock Fences and just double click to hide your icons. Either way, we don't need to see them.

Also consider whether we need to see your desktop at all. If it doesn’t add value, don’t show it on the screencast.

Fonts

Use the standard Visual Studio Font Colors. Remember that your audience likely hasn't changed theirs, and if you show them something fancy, they'll be thinking about how they get that fancy widget rather than your content. Go to Tools | Options | Environment | Fonts and Colors and click "Use Defaults."

In all your text editors, change your fonts to Consolas Size 15. It may seem counter-intuitive to have such large fonts but in fact this will make your code viewable even on an iPhone.

Remember, most video sites, including youtube, restrict the video player size to a maximum of around 850x480 unless you go full-screen or use a pop-out. Video is typically smaller than that. Use the font size recommended here, and use Camtasia’s zoom and highlight features during editing to call out key bits of code.

Don’t highlight code in the editor by selecting it with the mouse. It is typically hard to read editor selections in video. Instead, zoom and highlight in post.

Browser Setup

Unless your screencast is about using different browsers, pick a browser and stick to it. Hide your toolbars, clear your cache, history, and your autocomplete history. You'd be surprised how many inappropriate sites and autocomplete suggestions are published on the web forever and not noticed until it's too late. Don't view pr0n on your screencast machine.

Toolbars

Your browser shouldn't show any, and this is a good time to uninstall or hide whatever coupon-offering nonsense or McAffee pixel waster that you've stopped being able to see after all these years. Remember, default is the word of the day. Go Tools | Manage AddIns in IE9 or your favorite browser and remove it all.

If you are using Visual Studio or an IDE (Eclipse, Photoshop, etc) be aware of your toolbars. If you have made extensive customizations to your toolbars and you use them in the screencast, you are doing a great disservice to your audience. Put things to the default. If you use hotkeys, tell the audience, and use them for a reason.

Toast

Fred is online! Yes, but not during your screencast. Turn off Gmail, GChat, Messenger, Skype, Office Communicator and anything else that can "pop toast" during your screencast.

Clock and Notifications

Right click on the clock in Windows and click Customize Notification Area Icons. Remove the Action Center and Window Update and anything else that looks like it could bother you. Next, click on Turn System Icons On or Off. Turn off the clock! Why? You can't easily edit a screencast if there's a convenient time code in the corner that jumps around during your edits. Also, no one needs to know you're doing your work at 3am. I remove ALL notification icons. All of them, including Network and Sound.

Audio and Voice

Use a decent microphone. I use a Samson C01U. You can also use a USB headset-style microphone but be aware that breathing and "cotton mouth" really show up on these. Try moving the microphone above your nose so you aren't exhaling onto it directly. Use a pop filter to help eliminate plosives. You can get them cheap at a music store.

Be aware of your keyboard clicks. Some folks feel strongly about whether or not your keyboard can be heard during a screencast. Ultimately it's your choice, but you have to be aware of it first, then make a conscious decision. Don't just let whatever happens happen. Think about your keyboard sound, your typing style and your microphone, and listen to it a few times and see if you like how it comes together.

Avoid prolonged silence. There should be ebb and flow of "I'm saying this, I'm doing that" but not 10 seconds of "watch my mouse." Speak in an upbeat but authentic tone. Be real.

Don’t apologize or make excuses for mistakes – either work them in as something to learn from, or remove them completely.

If you make a mistake when speaking or demonstrating, clap your hands or cough loudly into the mic and wait a second before starting that portion over. When editing, the mistakes will show up as loud audio spikes, making it easy to find them.

Camtasia has decent automatic noise reduction. Use it. You’ll be surprised how much background noise your room has that you, but not your audience, will easily tune out.

If you must overdub a portion of the audio, sit in the same position you did while recording the original, and have the mic in the same spot. You want your voice to blend in seamlessly.

Preferred Output

Your screen capture should be produced at the highest reasonable quality as it will be compressed later when it's uploaded. Think of it like producing JPEGs. You can make a 5 megabyte JPG, but often a 500k one will do. You can make a 10 gig screen capture if you use uncompressed AVI encoding, but often a high bit rate MP4 will do.

The trick is to remember that your compressed screencast will be recompressed (copies of copies) when it is run through the encoding process.

Edit your screencast, if you do, in its recorded native resolution which hopefully is what you'll publish to as well. That means, record at 1024, edit at 1024, and publish at 1024. Let YouTube or your final destination do the squishing to smaller resolutions.

Personally, I like to know what's going on in my production process so I always select things like "Custom production settings" in Camtasia rather than presets. Ultimately you'll need to try and find what works for you.

When I know that my screencast will be encoding again by some postproduction system, first I'll ask myself, will they have my codec (compressor/decompressor) installed? That means, if they will have the TechSmith Screen Capture Codec used by Camtasia, then I can produce an AVI using this optimized codec, then THEY can make a MP4 or whatever.

But, if they don't, I consider what the post production system prefers, then give them a high bit rate QuickTime file, Windows Media file, or a MP4.

In my experience, if you use Windows, using WMV at the "best bit rate" gives a good balance between size and quality and can be easily squished downstream. Otherwise, use an H.264 encoder with a high bitrate for the video and 44.1kHz/441000Hz 16 bit mono for the audio.

Conclusion

Take some time. I put about an hour of work into a 5 min screencast. Your mileage may vary. Watch your video! Listen to it, and have your friends listen to it. Does it look smooth? Sound smooth? Is it viewable on a small device AND a big screen?

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

JavaScript is Assembly Language for the Web: Part 2 - Madness or just Insanity?

July 19, 2011 Comment on this post [42] Posted in Javascript
Sponsored By

UPDATE: Check out the Podcast I did with Erik Meijer on Hanselminutes this week on this very topic: JavaScript is Assembly Language for the Web: Semantic Markup is Dead! Clean vs. Machine-coded HTML.

Some folks think that saying "JavaScript is Assembly Language for the Web" is a totally insane statement. So, I asked a few JavaScript gurus like Brendan Eich (the inventor of JavaScript) and Douglas Crockford (inventor of JSON) and Mike Shaver (Technical VP at Mozilla). Here is our private email thread, with their permission.

Mike Shaver:

I've heard the comparison before, and I think it's mostly right. It ignores the amount of effort put into JS's developer ergonomics, though, since assembly is not designed to have a humane syntax (especially modern assembly).

Brendan Eich:

I said "JS is the x86 of the web" a couple of years ago [likely at JSConf], but I can't claim it's original. [Nick Thompson said it on Hacker News this year as well.]

The point is JS is about as low as we can go. But it also has higher-level facilities.

Shaver's right, assembly without a great macro processor is not good for programmers or safety. JS is. So the analogy needs some qualification or it becomes silly.

The mix of high-level functional programming and memory safety, with low-level facilities such as typed arrays and the forthcoming ES.next extension of typed arrays, binary data, make for a more powerful programming language than assembly, and of course memory safety is the first differentiator.

Douglas Crockford:

I think it is a little closer to the mark to say that JavaScript is the VM of the web. We had always thought that Java's JVM would be the VM of the web, but it turns out that it's JavaScript.

JavaScript's parser does a more efficient job of providing code security than the JVM's bytecode verifier. JavaScript did a better job of keeping the write once, run everywhere promise, perhaps because it works at a higher level, avoiding low level edge cases. And then Turing takes care of the rest of it.

There are certainly a lot of people who refuse to consider the possibility that JavaScript got anything right. I used to be one of those guys. But now I continue to be amazed by the brilliance that is in there.

Brendan Eich, again:

Doug's point about source beating bytecode is good. My friend Prof. Michael Franz of UC Irvine long ago showed O(n^4) complexity (runaway compute cycles, denial of service) in the Java verifier. JS is strictly more portable and fast enough to lex/parse as minified source.

Source as "bytecode" also avoids the big stupid Java bytecode mistake: freezing a poorly designed lowered form of Java, then being unable to evolve the high-form source, i.e., the Java programming language for fear of breaking Java bytecode compatibility. This severely messed up the design of inner classes and then generics in Java -- and then Sun broke bytecode compat anyway!

From a YCombinator Thread a while back, Nick Thompson said:

My admittedly biased view: I spent two years of my life trying to make the JVM communicate gracefully with Javascript - there were plenty of us at Netscape who thought that bytecode was a better foundation for mobile code. But Sun made it very difficult, building their complete bloated software stack from scratch. They didn't want Java to cooperate with anything else, let alone make it embeddable into another piece of software. They wrote their string handling code in an interpreted language rather than taint themselves with C! As far as I can tell, Sun viewed Netscape - Java's only significant customer at the time - as a mere vector for their Windows replacement fantasies. Anybody who actually tried to use Java would just have to suffer.

Meanwhile Brendan was doing the work of ten engineers and three customer support people, and paying attention to things that mattered to web authors, like mixing JS code into HTML, instant loading, integration with the rest of the browser, and working with other browser vendors to make JS an open standard.

So now JS is the x86 assembler of the web - not as pretty as it might be, but it gets the job done (GWT is the most hilarious case in point). It would be a classic case of worse is better except that Java only looked better from the bottom up. Meanwhile JS turned out to be pretty awesome. Good luck trying to displace it.

The point is, of course, that no analogy is perfect. Of course JavaScript as a language doesn't look or act like ASM. But as an analogy, it holds up.

  • JavaScript is ubiquitous.
  • It's fast and getting faster.
  • Javascript is as low-level as a web programming language goes.
  • You can craft it manually or you can target it by compiling from another language.

This topic comes up on Hacker News often.

  • "The JavaScript we've got now is the assembly language of the client-side. We can't easily change it, but we have to start building better tools on top of it." - jonnycat

Have at it. I enjoy our thoughtful, measured and reasoned discussions, Dear Reader. You guys rock.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Why the #AskObama Tweet was Garbled on Screen: Know your UTF-8, Unicode, ASCII and ANSI Decoding Mr. President

July 08, 2011 Comment on this post [54] Posted in Internationalization | Musings
Sponsored By

The Washington Post and the Garbled TweetUPDATE: The contractor/vendor that made the software commented on Hacker News with more technical information. They're a very classy shop and have handled this REALLY minor gaffe very well, to their credit. I mean, let's put this into perspective, it's a fun nit, it's a weird thing that only we programmers understand, but ultimately what we can all agree on is Obama should outlaw Smart Quotes immediately.

The Speaker of the House of Representatives John Boehner tweeted this a few days ago. Note that this is not a political blog post.

After embarking on a record spending binge that’s left us deeper in debt, where are the jobs? #AskObama

During the #AskObama Live Twitter event, the Tweets then came up on a big Plasma screen. This tweet came up "garbled" and said:

After embarking on a record spending binge that’s left us deeper in debt, where are the jobs? #AskObama

And a million programmers, regardless of political party, groaned in unison. First, because someone screwed up their UTF-8 decoding, by not doing it, and second, because our President doesn't recognize a text encoding bug when he sees one! Well, maybe that second one was just me, but still. Tragic. The President then teased the Speaker for his typing while newspapers and news organizations struggled to get their minds around this "garbled tweet."

Well, Boehner could have tweeted "that's left us deeper..." but he tweeted "that’s." Note the "smart" apostrophe. He used Tweetdeck to tweet it, and it was likely on a Mac. It's also possible that he wrote the tweet in Microsoft Word then copy pasted it as Word loves to change quotes and apostrophes ' into smart quotes and smart apostrophes with direction like this ’.

I can get John Boehner's User ID (not his twitter name, but the number that represents John) with this online tool http://www.idfromuser.com. I see that it's 5357812, so I can get his timeline as RSS (Really Simple Syndication)/XML like this: http://twitter.com/statuses/user_timeline/5357812.rss or JSON (JavaScript Object Notation) like this http://twitter.com/statuses/user_timeline/5357812.json 

When I ask for this timeline, the HTTP Headers say it's encoded as "UTF-8", see?

Content-Type: application/json; charset=utf-8

I blogged about the "Importance of being UTF-8"  about five years ago. If you look at the JSON and find the tweet with the ID 88618213008621568, you can see the raw text encoded in JSON:

"text":"After embarking on a record spending binge that\u2019s left us deeper in debt, where are the jobs?"

See that \u2019? In Windows (you have this program even if you aren't a developer) go to the Start Menu and run "Charmap." Look around and you can see U+2019 is Right Single Quotation Mark. Note that it's WAY down in the list of all the characters. It's not a basic character like A to Z or a to z. It's one of those special things that looks nice, but causes trouble later.

Character Map

If I make a text file in Notepad that looks like this and name it text.txt, for example, and Save As, making sure to use UTF-8 as the encoding...

After embarking on a record spending binge that’s left us deeper in debt, where are the jobs?

...then load it into any free HEX editor (or even an online one!) I see this:

The Tweet in a Hex Editor - E2, 80, and 99 are highlighted

Note that the part where the ’ was is actually three full bytes! E2 80 99.

Well, UTF-8 is an encoding whose goal was to not only support a bajillion different characters but also to be backwards compatible with ASCII, the American Standard Code for Information Interchange. If it wasn't, we wouldn't be able to see MOST of the characters in this tweet! In this case, just the ’ is goofy.

The code point was U+2019, which is 0010 0000 0001 1001, says Windows Calculator in Programmer Mode. You have this too, Dear Reader. There's some variable width encoding going on, that you can read about on Wikipedia.

This value of U+2019 expands to: 0010 0000 0001 1001, as I said, which then expands acording to these rules

zzzzyyyy yyxxxxxx ->
1110zzzz
10yyyyyy
10xxxxxx

Which gives us this

11100010 -> E2
10000000 -> 80
10011001 -> 99

hence, "that’s" is encoded as

74 68 61 74 E2 80 99 73

I've bolded the ’. Which then, read back in - this time as Extended ASCII (the ANSI Windows 1252 Code page) we get the ’ expanded:

that’s

Made it this far? Why didn't I just say "The software read in a UTF-8 encoded JSON stream of tweets and displayed it with an ANSI Windows Code Page 1252." Because that wouldn't be nearly as fun.

Either way, the company that did this for the White House definitely goofed up and should have tested this. This is SUCH a classic sloppy programmer mistake that I'm disappointed to see it showcased so blatantly. I hope they (the vendor) feel a little bad. The company appears to be called "Mass Relevance" and here's some news articles about Mass Relevance and their "Tweet Curation."

Testing, testing, testing,  my friends. And not only testing, but KNOW this stuff. They don't always teach it in schools and no one will learn until they see their bug on national TV in front of the President of the United States. ;)

UPDATE: The vendor said this in the comments. Very well said.

"It was definitely a mistake on our part. The problem was not the encoding on our data feed, but the HTML document was sent with ISO-8859-1. The second we inserted the twitter text into the DOM, the browsers interpreted the UTF-8 string as ISO-8859-1. Our visualizations are hosted on other platforms, and in this case the server was not configured to send UTF-8 with text/html even though the HTML file was encoded as such. It was the only issue (albeit a pretty obvious one) during an otherwise flawless event. I apologize to President Obama, Speaker Boehner, and Jack Dorsey for the mistake. If the readers of the blog think it was stupid, imagine how we felt. dev environment != production environment. If we would have just included a <meta charset="utf-8"> in the HTML head, then this would not have occurred.

The big take away is don’t make assumptions about other platforms (especially when it comes to encoding), and always include charset meta tag."

Mass Relevance

Text encoding is fun for all ages. Enjoy!

* Like this post? Put me on TV, folks. This is the kind of stuff that a real technology journalist *Pogue* would love to share with the people! ABC News? I'm available and I have Skype. Call my people. ;)

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Disclaimer: The opinions expressed herein are my own personal opinions and do not represent my employer's view in any way.