| |
Articles from
July 2010
As part of my site redesign effort, I'm taking a look at different screen resolutions users of my site have (I'll post something on that later). I noticed a few strange screen resolutions and wanted to compare the different aspect ratios. I knew a couple of them, but not all, so I figured PowerShell should be able to solve this problem fairly easily to ultimately give me the following information. Note that the chart was created in Excel. I could've used WPF, but since this is a rat-hole of a rat-hole off my actual task at hand, the redesign, I didn't want to get into WPF generation in PowerShell.
Breaking the problem down, we need to be able to go from 1024x768 to 4:3. In order to do this, we'll have to whip out some elementary school math to figure out the greatest common divisor. Luckily, this is pretty simple to determine. First, let's start with getting a list of all divisors for one number.
function Get-Divisors($n)
{
$div = @();
foreach ($i in 1 .. ($n/3))
{
$d = $n/$i;
if (($d -eq [System.Math]::Floor($d)) -and -not ($div -contains $i))
{
$div += $i;
$div += $d;
}
};
$div | Sort-Object;
}
This is pretty simple, but I should probably cover a few non-obvious things. First, @() is an empty array, which will be used to store all of the divisors. Looking at the loop, you'll notice that I only loop thru one third of the possible values. I hope I remember this correctly from school, but you do not need to loop thru all numbers between 1 and the target value to identify all possible divisors. This is simply a way to speed up the calculation. I'll leave it to you to explore the algorithm on your own, since that's not my focus here. Within the loop, the function checks to see if the divisor is a whole number and whether the value has already been saved to avoid duplicates then adds each divisor to the array. Pay attention to this because what's happening here is that PowerShell sees [array] + [object] and automatically determins that you must want to add a new item to the array. This was a very nice surprise. Finally, Sort-Object puts the numbers in order for us humans. Now, we can get all divisors for a specific number.
PS C:\> Get-Divisors 1024;
1
2
4
8
16
32
32
64
128
256
512
1024
Next, we need to get the common divisors for both the height and width of the screen resolutions.
function Get-CommonDivisors($x, $y)
{
$xd = Get-Divisors $x;
$yd = Get-Divisors $y;
$div = @();
foreach ($i in $xd) { if ($yd -contains $i) { $div += $i; } }
$div | Sort-Object;
}
This is pretty much more of the same. Get all divisors, create a new array to hold the common divisors, loop thru the divisors to find the commonalities, and finally sort the array. The array shouldn't need to be sorted, since the previous function did it, but I figured it's probably good to be sure.
PS C:\> Get-CommonDivisors 1024 768;
1
2
4
8
16
32
32
64
128
256
Next, we'll grab the greatest common divisor.
function Get-GreatestCommonDivisor($x, $y)
{
$d = Get-CommonDivisors $x $y;
$d[$d.Length-1];
}
This isn't even worth explaining. Arguably, we could've simply returned the greatest common divisor in the last function, but this is a good way to create composable, reusable scripts. After all, we need to retrieve a list of divisors all the time, right? :-P I won't bother showing what the output would be. I'm sure you can figure this one out ;-) We'll move right on to the last step, which will get the actual aspect ratio.
function Get-Ratio($x, $y)
{
$d = Get-GreatestCommonDivisor $x $y;
New-Object PSObject -Property @{
X = $x;
Y = $y;
Divisor = $d;
XRatio = $x/$d;
YRatio = $y/$d;
Ratio = "$($x/$d):$($y/$d)";
};
}
This will most likely throw you for a loop, if you're a PowerShell beginner and possibly even some intermediate users. You most likely expected the function to simply return a string, like "4:3". We could absolutely do this, but with the richness of PowerShell, using a string is somewhat wasteful. This all comes back to a goal of composable scripts that can be reused in the future. In the future, we may want more than just a string value. Since PowerShell is so good at passing around objects, let's create a new object that has all the properties that make sense for this context, namely the two numbers, greatest common divisor, individual ratio portions, and the string representation of that ratio.
PS C:> Get-Ratio 1024 768;
Divisor : 256
Y : 768
XRatio : 4
X : 1024
YRatio : 3
Ratio : 4:3
Now, we have what we sought out to get: the aspect ratio for a 1024x768 screen resolution. Let's face it, tho, we didn't want one, we wanted a bunch of them. To be exact, I was curious about 10 different resolutions. We've gone this far to automate this process, we might as well finish up with a function to get a group of aspect ratios.
function Get-CommonRatios($res)
{
$ratios = @{};
foreach ($r in $res)
{
$rat = (Get-Ratio $r[0] $r[1]);
if (-not $ratios.Contains($rat.Ratio))
{
$ratios.Add($rat.Ratio,
(New-Object PSObject -Property @{
XRatio = $rat.XRatio;
YRatio = $rat.YRatio;
Ratio = $rat.Ratio;
Count = 1;
}));
}
else
{
$ratios[$rat.Ratio].Count += 1;
}
}
$ratios.Values | Sort-Object -Property XRatio;
}
Again, this is all pretty normal. I'm using a hashtable (@{}) instead of an array to avoid duplicates and also created a new object to hold the metadata instead of the original ratio object because not all of the properties on the old object are applicable anymore. I also added a property to count the number of times the aspect ratio is used.
PS C:\> Get-CommonRatios @((1024,768), (1280,800), (1280,1024), (1366,768), (1440,900), (1600,900), (1600,1200), (1680,1050), (1920,1080), (1920,1200)) | Format-Table Ratio, Count;
Ratio Count
----- -----
4:3 2
5:4 1
8:5 4
16:9 2
683:384 1
There ya have it. The only special thing I did was format the results as a table with only the ratio and count properties. Hopefully, you were able to pick up a few new things for me, I was glad to explore the dynamic array handling and runtime object creation.
As I mentioned on Twitter, my site's long overdue for a revamp. I'm looking at ways to make my personal site a hub of all my activity on the many disparate services and social networks I'm part of. I have a number of ideas on how to bring them together, but it all comes down to how much time I'm willing to sink into this activity, given the many other things I should probably be working on instead. My biggest concerns are creating a hub of my activity, most likely moving my blog because I'm tired of managing the current platform, and coming up with a design that's more modern and fresh, yet simpler than what I have today.
I've been doing a lot of thinking over the past few hours and, while I don't want to slap my entire OneNote notebook of thoughts out here, I do want to share a wireframe of a conceptual home page. This is merely a conceptual layout from an information architecture perspective, but it's a start.
I'm thinking about the site having four main areas: about page, activity stream, blog, and articles. The activity stream is the most complicated piece of the puzzle, given the vast number of disparate services that provide lackluster offerings. While this has the biggest opportunity for improvement, it's also a huge time sink, considering people use those services and aren't going to come to my site just to see my end-to-end activity stream. Based on that, I'm not sure how much time I'll dedicate to it.
I'd love to get feedback from others. I want things to be as simple as possible. I threw around the idea of not having a main menu at all in an effort to let the context drive the experience, but I'm not sure that's approproate given the fact that people are used to seeing a menu. I should probably go for it and use instrumentation and analytics to determine which way is best. What do you think?
As fun as Foursquare is, it agravates me to no end at how short-sighted their interaction designers are (if they even have any). Admittedly, I have this problem with almost every piece of technology I use, but don't have the time to fix them all -- if only *rolling eyes, shaking head* What I do have the time for is finding a quick hack to something that was annoying me -- namely, checking all the to-do items on a Foursquare account page.
Go to any Foursquare account page, like the Bing account page, and you'll be presented with a list of usually 50 or 100 to-do items that often lead to a badge. Say what you will about Foursquare, I enjoy the game. I have gone thru several of these pages clicking each one after the other a few times now and finally got fed up. Within a minute, I was able to use IE8's built-in dev tools to come up with a quick solution.
If you're not familiar with the IE8 dev tools, simply open IE8 and press F12. The dev tools may open in a new window, but I prefer them docked at the bottom of my main window, since I'm usually on a laptop. The extra window is ideal for dual monitor setups, tho.
The HTML tab comes up first, which is where I started -- actually, that's not true, the first thing I did was jump over to the Script tab and type $ into the Script Console. This let me verify that Foursquare uses jQuery. Armed with jQuery, I knew I could accomplish what I needed fairly quickly. I selected the element selector arrow (first item on the toolbar on any of the tabs) and then clicked on one of the "Add as a To Do" elements within the page. This switched over to the HTML tab to show me a div with a checkbox. Most importantly, the div has a class of tip_todo_unchecked and the checkbox had an onclick handler. This is all I needed, thanks to jQuery. I moved back to the Script Console and used the following jQuery code to select all unchecked items and click them. Note that I had to "click" them to run the onclick handler. Simply checking them wouldn't have triggered the onclick event.
$('.tip_todo_unchecked :unchecked').click()
If you're not familiar with jQuery, the question mark ($) is an alias to the jQuery() function. Typically, you pass in a selector that is used to traverse and select HTML elements. In this case, we're grabbing all elements unchecked checkboxes (input elements with a type of checkbox) that are within elements with a CSS class of tip_todo_unchecked. While not exactly the same as CSS selectors, jQuery selectors were obviously heavily inspired by CSS selectors and aim to "embrace and extend" what CSS offers in this arena. The click() function simply calls the onclick event for each of the elements that were retrieved. It's that simple.
Note that you'll have to wait a few seconds while the page dynamically registers all of those clicks for you. I just jump down to the bottom of the page and wait for the last few to process.
Arguably, I should've put this into a GreaseMonkey for IE script, but my faith in IE add-ins has dwindled, so I don't use that anymore. Firefox users can do the same thing with FireBug and/or GreaseMonkey. Heck, there may already be a GM script for this. I don't know because I'm not a fan of Firefox -- not that I think IE8 is the best browser in the world. Obviously, the same capability is in Chrome, as well. The bottom line is that jQuery allows this simple hack.
If you were to ask someone on the street who the top technology company is, you'll likely get one of three answers: Apple, Google, or Microsoft. Whether you agree that these are the best technology companies or not, you have to admit these three own the broad mindshare. While I listed them alphabetically, I'd bet you'd hear them in that specific order. It all comes back to mindshare. IBM and Oracle are definitely top technology companies in the enterprise, but without a consumer focus, both are sacrificing this all-too-valuable metric. You can see how important this metric is by looking back at how technology was driven in the past. 15 years ago, technology was driven by enterprise needs. Over time, however, technology has become less expensive and more accessible, which has flipped that trend. Now, most technology trends are driven by the consumer market. But what did these three do to get that mindshare?
Ask anyone with an Apple product what they like the most or what their first impression was and they'll comment on how beautiful the device or interface is and how easy it is to use. Apple's core competence is exactly this: visual design and, to some degree, user experience.
Taking the same look at Google, first impressions are typically on simple interfaces and speedy responses. Alone, this doesn't tell us much, but if you take a deeper look, you see that Google is driven by algorithms. After all, search and advertising can only succeed with solid algorithms. This is Google's core competence: engineering.
To put it simply, Apple and Google represent the art and science of technology. As such, those are the crowds they attract. Apple attracts artists and creative professionals and Google attracts engineers and hard-core geeks. This is the key to both companies' success -- a targeted audience.
Having a targeted audience allows these companies to build precise, unambiguous experiences aimed at a specific type of user (or persona). You might say that neither Apple nor Google can do this because their products are used by a wide range of users. That's very true, but just because you target a specific persona, that doesn't mean your user base will never grow beyond that. In fact, it's just the opposite. By targeting a specific persona, you're able to focus your efforts and not only meet, but exceed that persona's expectations because you truly understand what their needs and goals are. With this, you're affording yourself the primary key to product success: passionate users.
Take a look back at the iPhone's debut. Were people not passionate about its sexy interface? Of course they were. And that passion was a virus that spread like a pyramid scheme. Google had the same effect, albeit much slower.
When Google first launched their search engine in the late 1990's, there weren't too many people using it. Yahoo was the most popular search engine at the time, with it's gaudy interface, attempting to be everything to everyone. Perhaps the biggest interaction mistake Yahoo made was attempting to follow the mythical 3-click rule, where users "must" be able to get to any feature within 3 clicks, or they will stop trying. I don't want to get into it here, but this is completely wrong. The way Google succeeded was by getting all the crap out of the way. By focusing on finding what you want, Google attracted geeks -- and a lot of them. Geeks told other geeks who told their family and friends and before you know it, less than 5 years later, Google was the #1 game in town -- all because they drove passion in a small subset of possible users. Of course, passion alone isn't going to earn you a multi-billion dollar business, but passion in the hearts and minds of the right audience can. Passion can also be dangerous.
If you're reading this, you're probably well aware of the stigma of Windows Vista. It's the worst operating system in the world, right? Not so, but the passionate few who did have bad experiences sure did let everyone know. As with the passion of the iPhone and Google search users, Vista haters shouted it out, loud and proud. But I'm not here to defend Windows Vista; I want to show you the value and impact of passion. Speaking of which, if Apple is #1 in the hearts and minds of artists and Google fills that spot for engineers, where does Microsoft fit in?
We can all agree that Microsoft isn't known for its superb aesthetics or engineering prowess, but it is good at both. And, when it comes to these three companies, Microsoft is arguably second in both areas, despite the fact that neither artists nor engineers will accept or admit it. Don't get me wrong, there have been some major blunders on boht fronts, but this is exactly my point. By not excelling in the art or science of technology, Microsoft is taking a back seat to both Apple and Google. When it comes to end-to-end user experience, Apple has the most mindshare, as I mentioned before; but I'd argue that Microsoft is second in this game. Yes, Google does have some wins in this space, but Google is nowhere near as dedicated to or capable of delivering the end-to-end user experience Microsoft is -- just look at Bing and Windows Phone. Admittedly, Microsoft has only started showing its ability in this space over the past few years. On the other side, Google drives mindshare for technology engineering; but once again, Microsoft comes in second. I can cite examples of why Apple sucks at engineering and Google can't quite cut it with end-to-end user experience, but I want to focus on the culmination of all this.
Microsoft has a tendency to attract people who want both beauty and brains; people who understand that beauty alone will get you nowhere and brains alone will leave you as exactly that -- alone. Together, beauty and brains will reach an even broader audience. This is the 80% Microsoft is known for targeting (for better or worse), which is exacly why Microsoft is as popular as it is. Everyone like to look at pretty pictures or solve problems .6825 seconds faster than the next guy, but the vast majority of the populations doesn't care -- as long as they can figure it out and their problem gets solved, they're happy. Let's face it, the best interface is no interface. If human beings could achieve their goals without interacting with your product, they would. Your product is a necessary evil.
Microsoft hasn't been successful by purely being a runner-up, tho. Microsoft has their own niche: developers. I know of absolutely no company that has ever had the ability to drive passion in developers as much as Microsoft has. Sure, iPhone development has seen a great boon, but that was forced (on Apple) and it wasn't because Apple had a great development platform; it was because users were flocking to the product. Microsoft has continued to deliver compelling platforms for developers to take advantage of year after year. This is only heightenedby the fact that Microsoft's partner ecosystem is fiscally 10 times the size of Microsoft itself. Said another way, partners make $10 for every $1 Microsoft earns. Given Microsoft's gross earnings, that's a huge market. I'd say that's definitely something to be passionate about.
While having 80% of the market sounds outstanding, this group is quite fickle and has no allegiences. They aren't opting out of the artistic and scientific approaches; they just don't care. So what drives them? Each of us has something inside that motivates us. If you want to be successful, you need to start with a core demographic, the primary persona you want to target. Remember that, by meeting everyone's needs, you meet no one's needs. This may seem counter-intuitive, but it's been proven time and time again. If you target a specific type of user, you're giving your primary users an opportunity to get passionate. There's no mathematical formula to cultivate passion -- if there was, Google would've figured it out by now -- but it all starts with targeted experiences. If you want to win in your market, drive passion.
To bring this back to those top 3 companies, Apple and Google are both fairly stuck in their ways. Both companies have art and science built into their DNA. I don't expect to see either company change. Microosft, on the other hand, has an immense amount to learn and I think they're on their way to correcting those. I can't say I expect Microsoft to surpass Apple in artistry or Google in engineering anytime soon; but I do expect Microsoft to give both companies a run for their money. We've already seen Apple reacting to Windows Phone 7 and Google reacting to Bing. As slow as the company is, Microsoft is a huge innovator. We've seen it in the past and I suspect the next 12 months will be full of opportunities for history to repeat itself as Kinect, Windows Phone 7, and IE9 come to fruition. Okay, there's some wishful thinking in that last one, but each of these platforms has developers chomping at the bit, eagerly awaiting their release. And, with each of these combining best-of-breed user experiences with solid, top-notch engineering, Microsoft is giving us something to be passionate about -- on all three screens (phone, computer, and TV), no less.
For the developers out there, how about your products? How are you driving passion in your users? For everyone else, what makes you passionate?
|
|
|
|