Susan IbachTechnical Evangelist
Find out what’s happening at the Microsoft booth at CUSEC 2013 and meet the Microsoft Canada Student team and recruiters.
Tonight, I hop on a train and head to Montreal to return to CUSEC. I can’t wait to talk to you about what’s going on this year around Windows 8, Windows Phone 8, Azure, and more. We’ve got so much happening I wanted to give you the top 10 reasons you should stop by the Microsoft booth at this year’s CUSEC conference.
10. Challenge a Microsoft employee or friend to a showdown on Kinect Dance Central
9. Enter to win an Xbox (by signing up for our communications)
8. Compliment @HockeyGeekGirl on her choice of hockey jersey for her Windows 8 presentation Thursday morning
7. Find out how to become a Microsoft Student Partner (did you know student partners get a free one year MSDN subscription)
6. Find out how students get free Windows Store and free Windows Phone Store accounts!
5. Find out how you could win a trip to St Petersburg Russia by entering the Imagine Cup
4. Find out how to get free stuff through Developer Movement (from Star Wars USB sticks to laptops!)
3. Find out how someone at CUSEC will get a Microsoft Surface.
2. Talk to a Microsoft recruiter
1. Register for the Microsoft sponsored CUSEC hackathon (and get a free t-shirt while supplies last)
As mentioned above, our GoDevMental team at Microsoft is sponsoring the CUSEC hackathon. The exact rules will be revealed tomorrow morning at the kick-off, but I can tell you it will involve developing for Windows 8, so you can get ready ahead of time by installing Windows 8 and installing the SDK before you arrive. To register for the hackathon, just stop by our booth to sign up!
Can’t wait to see everyone tomorrow!
Susan (aka HockeyGeekGirl) …now what jerseys will I pack…
First impressions matter, and your logo creates a first impression both on the Start screen and when someone sees your app in the store.
This blog is part of a series, if you missed a post you can find it here.
When someone searches for an app in the store, they see your app name, rating, price and logo. Based on that they may decide which app to choose from the store. We already talked about picking a good app name, now it’s time to consider your logo. If you are going to invest the time to build a great app, let’s make sure it has the best possible chance of being downloaded by users by creating a good first impression.
Take a quick glance at some of the search results I got back for games, the quality of the graphics varies widely. Would this influence your choice? When you see a logo that looks incomplete or unpolished it may make you wonder about the quality of the app that goes with it.
So exactly what size image files do you need for your Windows 8 app? If you create a new Windows 8 app, you will see a number of files in the Solution Explorer under the images folder. You should replace each of these files with a file containing the appropriate size of your logo. The name of the file indicates the appropriate pixel size for the image. For example 30x30.png should contain an image that is 30 pixels X 30 pixels.
Jeremy Foster has a list of references for stock photos, clip arts, audio, music and video. Not all the resources are free but many of them are.
Tip: If you are creating bitmap graphics, consider creating .PNG files since they can have transparent areas.
Tip: Consider taking the time to learn how to use Scalable Vector Graphics (SVG) instead of bitmap graphics such as .PNG files. With all the different screen sizes supported by Windows 8. Creating SVG graphics is done differently and will take you a bit of time to learn. But for a beautiful graphics experience on different screen sizes it is an investment that can pay off. (comparison SVG vs bitmap)
Tip: If you have an image with transparent areas, be careful what tool you use to resize the image. Many online resizing tools, or tools like MSPaint will remove the transparency when they resize the image. Thanks to Raju on Technically Personal whose post suggested good resizing tools that maintain transparency.
Modern.IE is a new tool from Microsoft which will examine your website and recommend code changes for better modern browser support
Today, Microsoft released Modern.IE, a tool that examines your code and detects code that may cause compatibility problems or that may prevent your users from getting the best experience on a webpage. The tool suggests fixes with web standards like HTML5 & CSS3 (or a graceful fallback code). It's not a complete checklist for coding modern web pages but it gives you a good starting point.
As part of the release, the IE team has also announced a partnership with BrowserStack. BrowserStack has a service that lets you test your site on any browser on any Windows OS. As part of the partnership, if you visit the BrowserStack site via the modern.IE site you can get three months of this service for free.
I decided to try the tool out for myself and see what the tool reported for www.godevmental.com.
To test the webpage, I just visit the modern.ie webpage and select Scan a Webpage.
Now I just enter the URL of the webpage I want to test: www.godevmental.com
Let’s see what the report tells me I should fix on my website. The report is broken down into three sections, so we’ll look at the results section by section.
I have no detected compatibility issues, my website is not rendering in Compatibility mode (that’s a good thing because it means better performance), and the DocType in my webpage is recognized by modern browsers. However, Apparently my website might benefit from using an updated jQuery library.
Looks like my CSS prefixes and browser plug-ins are okay. However my webpage layout might not display well on all the different screen sizes. The report suggest I look into media queries and provides some links on responsive web design basics.
My website also was flagged as needing improvements due to browser detection. For modern web pages it is a better practice to use feature detection rather than browser detection. The report provides a link to Modernizr and a link to learn about feature detection.
Not surprisingly, my website does not have a lot of features to support Windows 8 (yes, I work for Microsoft, but I also know my current site is a bit out of date, I do have new version of the website in the pipeline). The report suggests that I add support for default touch browsing by adding one line of code the –ms-touch-action CSS property. It also pointed out I don’t have a Windows 8 Start Screen tile defined for my webpage. The Start Screen tile allows users to pin my webpage to their Start page in Windows 8 and provides me with the two lines of code required to add that support. So all I did was enter the URL and I have 4 or 5 changes I can make to my website to improve support, and I have either specific code or links to help me make the fixes. Nice. Try it yourself. Okay, now of course I am curious, what happens if I run the report on the modern.ie site…
If you are building a Windows 8 app, you must support snap view. This video shows you how to do it with XAML apps.
I came across this video in a blog post by Jerry Nixon, a developer evangelist in Colorado. It’s a nice simple example and walkthrough on how to support the different views such as snap view, filled view, portrait and landscape view in a Windows 8 XAML app. The video takes a brand new page and adds support for each view and shows you how to check the appearance of each view.
Great explanation Jerry, thanks. There are lots of other great resources and articles on Jerry’s blog as well.
Once you’ve got that snap view supported, you are one step closer to publishing and getting rewards through the developer movement!
The following Windows 8 template makes it easy to get started on an app with a blog reader, twitter feed, list of events, members, and photos.
If you missed any other templates of the week, you can find them here.
This week’s template was created to make it easy for a club, team, or organization to share information about their activities, announcements, and members.
I have posted the .zip file on a Skydrive folder here. The zip files contains the code and the documentation for the template.
These templates are not Microsoft templates, they are open source and should be treated as such. They may contain bugs and code quality will vary. Nonetheless can be a useful tool when you are trying to learn how to build an app, and they can be a useful starting point for more complicated apps that follow a similar structure or require similar functionality.