Essential tools for Web Dev/Design on a Mac

Posted on the June 7th, 2009 under Apps, Web by Leon    

It’s no suprise - i’m a BIG Apple fan. I own an iPhone, iMac, MacBook and Apple TV. It’s not just the design and aesthetics that I love but the whole UI and user experience aswell as the great software that gets attracted to the platform.

Sure, there are other products that work or have the same features as Apple do - but they don’t seem to be able to pull it off in the same way.

So enough of the usual Apple fanboy babble, onto this post which is about three essential tools for anyone doing any Web Development on a Mac. I have included a local server, code editor and database management tool. I’m not going to go too in depth with each one - i’ll leave that for you to go and discover, but trust me they are all worth having on your system.

Mamp - local server

Coda - code editor

Sequel Pro - MySQL database manager

Slammer - grid system overlay tool

Balsamiq Mockups - rapid wireframing

Fireworks/Photoshop - design

Little Snapper - screenshot/annotation tool

Tweetie - to subscribe to brilliant resources

Spotify - you need to listen to tunes while you work right?

Really simple jQuery alerts

Posted on the June 6th, 2009 under Uncategorized by Leon    

picture-3

Over the last few month’s I have been using jQuery more and more in my web projects to do everything from style forms to adding interactivty to lists via drag and drop. In this post I will share with you my simple jQuery alert plugin.

About

Simple jQuery alert that is just that - really simple

Use it to give feedback to your users when they have updated a page for example.

Features

There are three types of alert:

  1. Success
  2. Error
  3. Information

 
The alert can fade away after a specified amount of time

The alert can be clicked to fade away

Usage

Include the CSS and plugin files in your header

<link href="css/alerts.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/alerts.js"></script>

To call simply add this function call:

$('.msg').simpleAlerter();

You can pass in a parameter which is the number of seconds (in millisecons) for which to display the alert. If you leave it blank the alert will stay on screen until clicked

$('.msg').simpleAlerter(5000);

And then apply the class of “msg” and either success, error or information to your html element. For example:

<p class="success msg">This is a success alert on a paragraph</p>
<div class="error msg">This is an error alert on a div</div>
<ul>
<li class="information msg">This is an information alert on a list item</li>
</ul>

Demo

Click here to view a demo page and to read more about how to use it.

Click here to download the files

I’ll see you there!

Posted on the May 30th, 2009 under Flash, flash by Leon    

At Flash Camp Birmingham that is:

Flash Camp Birmingham

I don’t really need to say more than that I don’t think. It promises to be a great day out and hopefully i’ll have a new version of flCodr up for then!!

Use your iPhone as a wireless speaker

Posted on the April 20th, 2009 under Mac Info, Music, iPhone by Leon    

picture-2

This post will show you how to use your iPhone as a wireless speaker so that you can stream your iTunes library (or any application) to your iPhone.

(This will only work within Wi-Fi range of your computer running iTunes)

This set is up uses the following:

To get this to work you will need to Jailbreak your device, if you are scared of doing so - don’t be. There are plenty of posts around to help you. The reason that you need to Jailbreak is so that you can install Backgrounder - a nifty little app that allows you to run applications in the background (i.e after you have pressed the home button). We will use this to run Airfoil (an app that allows you to stream audio from a Mac/PC to your iPhone) in the background is so that we can control iTunes on the host machine by using the Remote app.

In order to get it all working simply follow these steps:

  1. On your Mac install iTunes and make sure it is the latest version.
  2. Ensure that your Mac is connected via Wi-Fi or your router has Wi-Fi or there is a Wi-Fi device on your network. Also make sure that your Wi-Fi is activated on your iPhone and is on the same network.
  3. Install the Remote app on your iPhone and get it connected to iTunes on your Mac.
  4. Install Airfoil on your Mac and set the audio source as iTunes
  5. picture-3

  6. Install Airfoil Speaker on your iPhone
  7. img_0021

  8. Download the Backgrounder app via Cydia and in the Backgrounder preferences set Airfoil to automatically run.img_0024
  9. Open up Airfoil Speaker on your iPhone and connect to Airfoil on your Mac (this should be automatic if both devices are on the same Wi-Fi network).img_0023
  10. Press the home button (if Backgrounder is enabled then it will still be running)
  11. Open the Remote app on your iPhone and start playing some musicimg_0025
  12. With any luck, you will be able to control your Mac from your iPhone and have the music streamed back to you via Airfoil.
  13. Walk around your house with a smug look on your face as you marvel at how brilliant the iPhone is - again!!

Wordpress as the next Social Networking platform?

Posted on the April 9th, 2009 under flash, flcodr by Leon    

Question : Can Wordpress be used as the next social networking platform?

Answer: Yes.

OK, maybe you want a bit more detail and at least some proof of my exorbitant claims. That proof will be in the form of a brand new flCodr.com - a site designed to share and submit snippets of actionscript code.

Using nothing more than Wordpress, off the shelf plugins and a bit of theme hacking I will show you how to create your own social site using Wordpress.

About a year ago I released flCodr to the world. The idea was pretty simple; as a Flash developer I was always writing and re-using snippets of code. Quite often these snippets would be scribbled onto scraps of paper or into text files. Either way, I had no method of organising or easily retrieving the said snippets. As a solution I set up flCodr as a way to store, tag and access my library of snippets. This was a web based option and meant that at home or work I had access to my code. I even went a step further and made an extension that allowed the user to get the snippets directly from with Flash.

The idea and concept were great, however the platform that I built it on wasn’t. I had created the site in a few weekends and this started to show as more and more users began using the site. One main area of concern was with user registration - rather than creating my own, I hacked an off the shelf script to work (or not in this case).

I had a desire to improve flCodr and was about to re-write it using Code Igniter. As I began to plan the new structure out something hit me, and it hit me hard - why not use Wordpress as the core of my new flCodr site. Everything from the structure of the old site translated perfectly - each snippet could be a post which would have tags, be assigned to a category and contain other meta data.

User registration and log-in could also be handled by Wordpress and the huge array of plugins out there could easily provide the rest of the functionality.

I will be writing more posts in the coming weeks documenting the plugins and tools that I will use to create the site.

How I find new music using my iPhone

Posted on the March 4th, 2009 under Music, iPhone by Leon    

Over the weekend I updated my iTunes library and I now have over 23,482 songs. Due to my iPhone having only 8GB of storage space there was no way that I could have all that music with me all of the time, but with a few apps I don’t need to physically carry my music with me. The iPhone has opened up a host of ways to find, share and play music while on the move. This post is about some of the tools that I use to achieve musical bliss.

Shoutcast

This is a free radio app that features thousands of internet streams. Its works great over wi-fi and 3G and features a good selection of niche stations. It allows you to add favourite stations and also search. At present I am listening to Dubstep.fm and Digitally Imported.fm. The quality of the streams is pretty good and the only drops in connection I have had are due to having a weak 3G signal.

Last.fm

This app needs little introduction. A great way to listen to over five million songs, share music via your phone contacts; purchase tracks and albums from the iTunes Music Store, and much, much more. By using the recommendation feature its a brilliant way to discover new artists. you can even save tracks you like to new playlists on your phone and then access this from the Last.fm app on your Mac or PC.

Noteworthy

NoteWorthy allows you to search through Last.fm’s powerfully awesome database of artists with ease and then mark albums and tracks that you want to remember. Select information like biographies and similar artists to download as well. This is great when listening to the Shoutcast as a way to remember tracks as the DJ announces them.

Simplify

Enjoy songs from home while at work or from any WiFi location. Explore friends’ music while they are online. This app is great as I can stream any of my 20,000+ tracks to my iPhone.

You may be thinking one thing - the above apps are great but what if I want to do something else with my iPhone while using these apps. At present Apple doesn’t allow 3rd party apps to run in the background. This means for example that you can’t listen to Shoutcast and read email or browse Safari at the same time. The answer to this is a tool called Backgrounder. You will need to Jailbreak you’re iPhone to get it, but this is a simple process now. Read here for how to do it. Don’t blame me if you mess things up though!

With Backgrounder you can allow certain apps to run all of the time. This is great as I don’t get interupted from Last.fm each time an SMS comes through. Be careful not to allow too many apps to run as your iPhone will become unstable due to low memory. I have tested all of the above apps with Backgrounder for the last week now without any problems.

Shazam is also another great tool to find music. Create and share music moments and stories. With Shazam you can identify music tracks simply by holding your phone near to the music source, buy them, and share the tags with friends. You can also learn more about artists; keep and grow your music collection and personalise your tags.

Update 2 - Last.fm/Spotify mashup

Posted on the March 2nd, 2009 under Web, spotify by Leon    

Here is the video of the mashup in action. I’m thinking up a new idea using the Last.fm api that will hopefully work better. As this was just a proof of concept it won’t be released any time soon.

Update to Mashup

Posted on the March 2nd, 2009 under Uncategorized by Leon    

So it seems my server got overloaded due to the excessive api calls my lastest mashup was making to the last.fm server.

This did work fine when I had it running locally, I may post a video of it in action instead of the demo. In the meantime I am thinking of another tool. The other day I worked out how much my iTunes collection was worth based on 79p/track. The figure was over £18k!! Maybe a little tool to work out your last.fm value based on your plays would be fun, if I was feeling cheeky this could be linked to how popular each artist was. It may even be nice to plot these against your friends in a share index style way. Pretty much anything is possible with the api so when I have a few spare minutes I will give it a try.

Another Last.fm/Spotify mashup

Posted on the March 1st, 2009 under Web, php, spotify by Leon    

A month or so ago I hacked the last.fm for wordpress plugin to allow for integration with Spotify. The basic  idea was that the plugin would pull in your recently played tracks and then allow users to open those tracks directly within Spotify by clicking on a green note.

A had a spare two hours this morning so decided to see what I could make in that time.

This new mash-up is a little different. You give it your Last.fm username and it will go and find your top artists. It then uses this to find the top tags for each of those artists. It then orders the tags by the amount of times they occur across your top artists and displays the result to you in a slider window. The images are pulled from Last.fm and they are for the top artist for each tag. The image resolution is based on the quality of the image on the Last.fm servers.

I used the Last.fm PHP API available from here as the basis for the mashup. There were quite a few sample scripts and I hacked a some of these together to get the functionality required. The slider part came from here.

You can view it by heading here and putting in your username. Please be patient as it takes a while to load everything in. Update! This keeps crashing my server so I will post a video of a locally run version.

I can’t wait for Spotify to release their own API as there would be the possibility to generate Spotify playlist based on your ‘loved’ tracks on Last.fm for example.

Google Apps Status Dashboard

Posted on the February 27th, 2009 under Web by Leon    

After changing my domain hosting to Dreamhost, I also set up Google Apps for my Mail and Calendar services. So far the service has been brilliant and I didn’t seem to notice any problems after Google’s recent outage. In response to the downtime Google has launched an App Status Dashboard so that users can see if their services are up and running correctly.

Take a look at it here.