Blog Aesthetics & Improved Functionality

blank book

I had planned to blog about my use of Google Docs this past week. With it being half term, I certainly had the time to do so, but instead, I ended up using much of my time improving the design and functionality of my blog.

Here is a summary of the changes that I have made.

Design
One of the key things that I wished to change was the appearance of the blog, particularly the home page. I wanted it to be more minimal, have less information, with limited colour. Ultimately I wish to just show the 10 most recent blog post titles but for now I have set the blog to simply show the most recent post. I also changed the colour of the “visited links” as they were too light.

I created two new static pages. The first of which was a contact page including a self made form utilising the site:EmailMeForm. The other a dedicated page for the #movemeon book which I contributed to. This allowed me to remove a badge advertising the book from the blog’s sidebar as well as some text and hyperlinks.

To further improve the look of the blog across all of the pages I made further changes to the sidebar. I began by removing my Twitter stream and some unnecessary text.  I then considered changing the subscription and follow links from plain text to attractive “minimal” buttons.  Using my Twitter PLN I found some links to different button sets. After settling on a set which I found here, I created two mock ups and tweeted them out asking people to vote for either the set on the left or the right.

blog buttons choice

The set on the left received the most votes and that was my preference as well so I decided to go with it and went about adding the buttons to my blog (more about this process below). I also moved the buttons up to the top of the sidebar to increase their visibility. (I’m still mulling over the final row at the bottom which would include my Google Reader shared items, a link to call me on Skype and a link to my school Media Studies blog.

Finally, I edited my About page, updating sections with some of the projects I have been involved with this year.

Functionality
In making some of the aesthetic changes mentioned above I was also able to make some improvements to the functionality of my blog.

Changing the subscription and follow links from plain text to buttons meant that I had to learn more about HTML. (I already had some limited knowledge.) I learned how to add the buttons, hosting them in picasa and then linking to them. I wanted them to open in a new window/tab so I researched the code needed to make that happen and I also learned how to make text appear when the cursor hovers over them. I am very pleased with the finished functionality and hope that their placement at the top of the sidebar will help to increase my web presence.

Having learned how to make web links open in a new window/tab I set about editing all of my blog posts from May to do the same. Sticking with HTML I also added some code to my blog’s template to display related posts titles at the bottom of each post.  This should hopefully keep visitors on my blog for longer reducing my bounce rate. I then also removed the Sharethis widget (and related functionality) and replaced it with a TweetMeme retweet button. (See the bottom of this post.)

Finally, I made two significant changes to improve the subscription feed and data that I can get about my blog’s site traffic. I began by signing up with Google FeedBurner and syncing my old blog feed. I implemented a variety of additions (“FeedFlare”) to improve the promotion of my blog including syncing my Delicious bookmarks into my blog’s feed and making a wide variety of options for sharing my posts available to subscribers. I also set up subscription by email which I had seen on several blogs by people that I respected so felt it would be wise to offer my readers something similar. The final piece of code that I added to my blog was that of my Google Analytics account. It has already provided me with far more interesting information about my blog than the simple visit counter sitting at the bottom of my sidebar (which I may remove very soon).

So, no post about Google Docs but a lot of blog activity none the less. I am happy with the way the blog is looking and for now will give the tweaking a rest. I am not done though. Once the summer holidays begin I think that I will return to this process and do the following:

  • Add code to my blog so that only the blog post titles are displayed on the home page, archive page and label pages.
  • Display both the archive and labels in the sidebar as either a drop-down menu or expandable widget.
  • Add a blog roll of blogs I enjoy reading – also to be a drop-down menu or expandable widget.

I am always happy to know what people think so please comment below or tweet me @jamesmichie.

Image courtesy Štěpán Prokop on Flickr.

Creating Desktop Apps With Fluid

fluid

My best and most recent tech find for Mac is Fluid. Fluid is an application that allows you to create standalone desktop versions of your favourite web apps such as Gmail or Twitter. Neither of these appealed to me as I have Gmail synced with Mail on my Mac, and on my iPod Touch (I also sync Google Contacts, Google Calendar and my school Outlook account) and I use TweetDeck to keep up with my PLN.

However, there were some web based apps that I felt would be great to have on my desktop due to the fact that it would be good to be able to view them within a separate interface. What’s more after doing a little more research I found that if I used Fluid to create apps I would be able to make use of user scripts to tweak them – that sounded great, so I decided to begin with Google Tasks as I am always looking for ways to improve my organisation and productivity.

Google Tasks

And here it is. It looks clean, signs in automatically and everything works: Adding tasks, adding info, marking when complete, syncing with Google Calendar and therefore Ipod touch.

tasks

If you would like to do this you need to download Fluid. Once installed, open Fluid. You will see a dialog box (see below) into which you need to type or copy/paste the following URL: http://mail.google.com/tasks. Name the app Google Tasks. Keep the location as Applications. Download an icon to use, I chose one created by Max Headwound on Flickr (image below), found on the Flickr: Fluid Icons Pool. Then click “Create”.  You will see a new dialog box asking you to launch the app. Voilà, you are done!  You can then drag the app from the Applications folder to the dock.

fluid new app creation

tasks icon

For ease of use I also added my newly created Google Tasks app to my login items so that it would load automatically when I boot up my Mac. To do this go to System Preferences / Accounts / Login items / Click the + symbol and select the Google Tasks app from the Applications folder.

login items

There are also some nice icons available at IconsPedia, choose the icon that suits you! As a Mac user image is important to me so selecting the right icon was as important as choosing which web apps I would turn into desktop apps. My next web based app that I use every day was Instapaper.

Instapaper

The process is the same as before using the following url: http://www.instapaper.com/u. If you have not used Instapaper before, I highly recommend it. It makes up an integral part of my web workflow, something I plan to write more about in a future post.

Instapaper allows you to store web pages and articles that you find to read later. It makes use of a bookmarklet to do this but if you are using the beta build of Google Chrome you can use the Instachrome extension. I have been using this extension for almost a month now and it makes adding pages to Instapaper a breeze.

Instapaper comes into its own if you have an iPod touch as the articles can be synced for offline browsing. As a serious user of Instapaper I recommend the pro version, I use folders and it helps to have them synced, saves having to repeat actions later as everything can be done from the iPod.

Here are the results of setting up Instapaper with Fluid:

instapaper

I didn’t stop with this one in simply creating the app I also installed a user script called Instapaper Beyond. It’s a script for Fluid created by Brett Terpstra which adds keyboard navigation and some special features. For example: (alt+g) brings up the “Go to folder” menu – just one of the very useful functions offered in this script.

instapaper beyond go menu

There are many more functions that make browsing Instapaper very enjoyable all of which can be controlled by the keyboard. Pressing (h) will bring up a full list of them.

instapaper keyboard navigation

And that’s it. Two apps that help improve my productivity and workflow when surfing the web. I think that I am going to create a stand alone Google Reader app as this makes up another integral part of my web workflow.

If you have any questions or want some advice about this process please e-mail me or tweet me @jamesmichie. Comments are always welcome.

I’ve Been Chromed!

browsers

As Google Chrome comes of age (in beta at least) I have kicked Firefox to the kerb, an act that I thought may never happen, for 95% of my web experience. The only thing that is keeping the Fox in my life at all is the poor integration Chrome offers with Moodle which is my schools VLE of choice. More info on Chrome’s shortcomings with Moodle and how to get past them (unless you only run Apple products like me) can be found on “Changing The Game” a Moodle-oriented blog written by @iusher.

I’m not going to dwell on Internet Explorer, Opera and Safari for very long. It’s a simple matter of security + usability + reputation that turned me into a Firefox user in the first place. IE as has been widely written about is simply not secure enough. On top of this it is a Microsoft product so is automatically put in the do not use pile for me. While I consider myself to be something of a geek, Opera is one step too far as Browser’s go; in much the same way as Linux is in terms of operating systems. What did surprise me was the fact that I didn’t turn to Safari as my browser of choice. Having started life as a Windows user Firefox came more naturally into my web based experience – or in other words the Fox did a better job of marketing itself.

When I started using Firefox, its reputation was already well established as a stable and secure browser. Then “add-ons” were introduced there was no turning back. Firefox was simply awesome contributed significantly to my “geek” development. As I sought ways to make my web browsing experience better the Fox taught me about user scripts via Grease Monkey and how to edit its’ functionality itself. See this guide on how to speed up Firefox. What I ended up with and used for the past couple of years never considering alternatives was a very fast, very user friendly (due to add-ons), very consistent web browser.

However the Fox had its limits. There were so many add-ons that I would want to try them all out. But Firefox was not always up to the task. Install more than 10 add-ons and even with the tweaks that I had made to speed it up it became more like “Smokeyfox” than Firefox – the metaphorical smoke pouring out when it fired up or tried to load a page with a lot of info. The experience that many of the add-ons were supposed to offer became limited when they were all packed in together. I ended up stripping Firefox back in the end to just a few add-ons and scripts. This made the browsing faster but the experience less rich.

Chrome on the other hand is faster than Firefox even with “extensions” and scripts installed. I was sceptical at first but I (like a good geek) did several tests to see if the claims were true. And yes, they were! My take up of the browser was stalled though as functionality was limited in its initial release for Mac. Bookmark integration was not fully sorted and there were no extensions available. I bided my time and waited for the first stable release to really get to grips with it. I fell in love immediately because Chrome embraces the true aesthetics of Mac – clean simple design. Use Chrome for a few minutes and I fail to see how anyone could not like the simplicity of the interface, it is beautiful.

chrome in use

Look closely at the picture above. What you see is what I want to see. I have a variety of scripts and extensions installed but many remain invisible working from within the browser itself. There is no need for clunky menus and the tab positioning and functionality is great. Chromed Bird, Instachrome and Delicious all use pop-out windows that float in front of the browser when you click on them. Finally, the Omni-bar is truly great – search, history and my delicious bookmarks are all integrated into one space. This makes the use of the browser so much smoother and cleaner.

chromed bird

I am currently using the development channel, this enables me to not only use extensions but also to install scripts from sites such as Userscripts.org. Chrome extensions make the experience as rich as Firefox but they have almost no impact on operating speed. User scripts load directly in to Chrome without the need for an extension such as Grease Monkey. The installation process of all extra Chrome features is very smooth and there never a need to restart the browser. Below is a screen grab of just a few of the extensions/scripts that I have installed.

chrome extensions

Sites that I frequent load as fast with the extensions enabled as they do disabled, making the Chrome experience truly worthwhile. Whether a solution arrives through Chrome first or when Moodle 2.0 (Check out this brief tour here) is finally released I will kick Firefox to the kerb permanently. Until that day, the Fox will still play a small part in my life.

It will not be long though and the time will have come to say “goodbye old friend”.

Browser button image courtesy of Dekuwa on Flickr

Connecting With Parents Online

rubiks cube

Last night I delivered an online presentation to parents of Year 11 English/English Literature students.  50 parents were in the room as well as myself and a colleague from the English department.  We had numerous e-mails from parents who wanted to get in to the meeting but couldn’t due to the fact that we were over capacity.  While that is frustrating, it is also very exciting. The highest number of participants in previous online meetings had been a little under 40 – a new record for the school. We are going to look into the capacity issue so it can be resolved for future events as the Science and Maths departments are due to do similar meetings in the very near future!

Link to the Online Meeting. (Link removed at request of school SLT)

A little background on CCC and its use of online conferencing:

At my school we have been using Adobe Acrobat Connect Pro for some time; video conferencing having become “a part of what we do”.  Our most prolific use of Connect Pro can be found in our delivery of an “Online Games Design Course” that is attended by Creative Media Diploma students and any other students who have an interest in games design.  This is currently running on Thursday nights between 7:00 and 8:00.

The meetings are led by @rhadad who is a teacher/games designer from Chicago.  She beams in every Thursday at 7.00 along with a guest presenter (Moses Wolfenstien@camaxwell@gtrefry) to teach the students about  games design.

This was pioneered by @greghodgson and @hstower last year and is now set to become a yearly course.  I (@jamesmichie) have been supporting the delivery of the meetings this year along with @iusher who continues to be an invaluable resource to us, in all of our online endeavours – including the session with parents last night.

Right, back to last night’s meeting!

The parents were invited to attend the meeting in a multitude of ways: text message, e-mail, postcard – each one had a link to the meeting room and brief explanation of how it works – Connect Pro install a patch the first time you run it.  As far as I am aware the parents had no problems with this.  We also put a banner on the front of the school website as a reminder.

We received many e-mails in advance of the evening from parents who wanted to be there but had prior arrangements .  As I mentioned earlier, after the meeting we received numerous e-mails from parents who could not get in and many e-mails also from the parents that did get in for a copy of the PowerPoint presentation that I used to show useful ideas, web links, our VLE and an iPod touch app (Flashcard Touch).

The number of parents online (or who wanted to be online) is amazing.  It felt during the presentation and afterwards that there was a real buzz – which continued throughout today.  Most importantly the response demonstrate that parents want to be involved in their child’s education and they want to be informed. Below is the PowerPoint presentation I used in the meeting:

[Update]: Presentation is no longer available.

[Aside] I also learned that I need to find better lighting for future meetings – I look too much like some strange lurker in the dark!

In conclusion:

It was a great experience! The buzz throughout the day has been great.  Since I began writing this post I have had over 20 more requests for a link to either the presentation or for copies of the PowerPoint. The school switchboard has had a similar number.  Adding the total number of participants to the number of e-mails we received from people who could not get into the meeting, we could have had over 90 participants – which would have been a third of the year group!

As a colleague put it: “We do all this hard work throughout the year but it’s just 20 minutes on a Wednesday evening that could make the difference.”  Hopefully the “difference” will be seen in the students results this summer!

If you would like to know more about what we are doing with online conferencing you can e-mail me or tweet me @jamesmichie.

Image courtesy of Toni Blay on Flickr.

New Blog! New iPod! An Update!

Since this whole blogging thing started with my new iPod touch I thought that it would be fitting to make my final post for week one of “James Michie…a 21st Century Educator” an update on my progress learning to use it, the apps I’ve added/deleted and my first game download.

apps 19.02.10

The image above is my current set of apps and the layout that I am currently working with, since my last post I have done the following.

  1. I realised that apart from “Tasks” there was no major benefit to me having each Google feature as a separate button – I can access them all from within the “Google Mobile App” and once I am in I usually leave them loaded up so that I can simply return to them at leisure within Safari.
  2. Instapaper is even more useful to me now that I have access to it on a mobile device.  I have been reading even more, increasing my productivity and in turn filling up more of the free space in my “brain-attic“.
  3. Having moved from WordPress to Blogger I have installed but not used the “BlogPressLite App” – it has gained mixed reviews but I will try it out sometime in the near future.
  4. I have read two whole books, downloaded with “Stanza“.
  5. I have used the Notes App twice when asked to go pick up some odds n’ ends from the shops.
  6. I have gotten somewhat annoyed by the fact that if I check my mail using the Mail App that it leaves a copy of the message in the All Mail folder after I have deleted it from the Inbox.
  7. I have watched bits of programmes on both BBC iPlayer and through “TVCatchUp“.  Although, I have not settled with myself the idea of watching a whole show on such a small screen – after all I am at home and have a 17” Macbook Pro that serves my online viewing pleasure very well.
  8. I deleted “Wikipanion” after I realised that learning the touch-screen finger swipes to move, zoom in/out, select all, copy+paste was not that hard, using Wikipedia on Safari was not that difficult after all.
  9. I am going to stick with “TweetDeck” – it is working as well for me on the iPod as it is on my desktop.
  10. Finally, I downloaded my first iPod touch game.  I have not really played a computer game since university so this was a treat.  My first computer when I was just five years old was a “ZX Spectrum 128k” (the one with the built in tape deck) – its bread and butter was platform games.  So I went for “Ghosts’n Zombies” a single player-platform game with plenty of shooting, lots of bleeps and squeeps and nice cartoon-styled graphics.  It makes good use of iPod touch’s “accelerometer” and I have enjoyed playing it – while it’s a new game to me and the input method is very different to using a joystick or joypad it was an almost nostalgic experience.

Well, that is all for this week.  I have enjoyed exploring and learning to use my new iPod.  Being back at school next week will give me the opportunity to push one or two of its features further inside the classroom and during meetings.  It is my hope that it goes someway to furthering my efforts to be paper-free!  I can’t really call myself “…a 21st Century Educator” if I’m still reliant on pen and paper, now can I?