Click here to download the complete package (report + UML + source).

Report: PDF link
UML diagram: JPG link
Source: ZIP link (incl. libraries, excl. MT4J framework)
SVN repository

Demo

Team 6 wishes you a happy new year!

Here’s how it SHOULD work

The user drags an MP3 (or folder of MP3s) into our application. The metadata of the track(s) is loaded and the Last.FM API is called for more information about the track(s). TouchTrack also fetches a list of similar tracks.

Next, everything is loaded into a “spring graph”. This is a network of nodes representing tracks, which are connected via “springs” if they’re similar. The user can now navigate through this network with multitouch gestures. Tapping a node expands the graph with more similar tracks (gathered from Last.fm).

Here’s our storyboard:

The project is structured according to the MVC design pattern. We’re very happy with the overall design of our application. For once, we’re confident that this part wont be a problem in our report. The “model” and “controller” bits are long finished, but the “view” part turns out to be quite difficult to implement (compared with our previous projects).

Although the concept for this project is quite simple, the implementation is not at all trivial. We’re especially having difficulties with visualizing the data in a nice graph. At first, we tried to implement a simple force-based algorithm to position the graph nodes and edges. This worked, but didn’t really turn out visually appealing. Now we’re using the traer.physics library. After a few hours of (unforeseen) work, we managed to create a nice spring graph with realistic physics, but we still need to work some more on the gestures.

At the moment, we’re using the following technologies and libraries for our project:

• Robert Harder’s Java FileDrop class for detecting new MP3 files.
• The Tritonus API for loading MP3 metadata and playing the tracks.
• The Last.FM API for loading more metadata.
• Java bindings for accessing the Last.FM API.
• The MT4J development framework for multitouch support.
• The Processing language for visual effects.
• A particle physics engine called “traer.physics” for creating realistic spring graph physics.

This is definitely the most challenging multimedia project. Luckily, we’ve still got some time left, but unfortunately we also need to concentrate on studying for other courses.

Dit is een iPhone web applicatie die gebruik maakt van de iPhone GPS functionaliteit om de geografische locaties van Last.fm gebruikers te verzamelen in een eigen database. In combinatie met de Last.fm API kunnen de users zo op de hoogte gesteld worden van de locaties en muziekinteresses van anderen in hun buurt. Tevens kunnen de gebruikers met elkaar chatten.

Klik hier voor het verslag (pdf).
Alle source files (zip).
De link naar onze toepassing.

Video demo van de applicatie:

We decided to keep the storyboard of our Android mashup, because the iPhone supports all the functionality our app needs. In case you haven’t read our report on the Android project: our application (“GeoTrack”) tracks the geographical locations of Last.fm users. When a user logs in with his or her Last.fm nickname, the GPS coordinates are send to our server and the coordinates of other, nearby Last.fm users are send back. The user can then see (on a Google map or in a list) which other Last.fm users are nearby his/her location. For each user, extra details (distance, last logged in, artist matches, …) can be requested.

The iPhone web app will have the very imaginative title “iGeoTrack“. There will be some minor changes though, mainly UI-related:

• The “log in” screen will be similar and might require a password now.
• The user will be redirected to a menu, instead of immediately loading the map. The menu will feature the following items: Map, Users, Settings, About.
• The Map screen will be similar to the Geo screen in the Android app: it features a Google map with a clickable marker for each nearby Last.fm user.
• The Users screen will list all nearby Last.fm users (the markers on the map), similar to the Track tab in the Android app.
• The user details and artist matches views will also be almost identical to the corresponding Android views.
• A new Settings view will be available. The user will be able to configure the maximum distance to other users, the minimum % of similarity in music taste, …

The same server side configuration will be used in iGeoTrack for the backend. A MySQL database stores the locations of the Last.fm users and the PHP Last.fm API of Matt Oakes is used to retrieve the Last.fm information. All server side scripting is done in PHP.

The client side scripting is done in XHTML, CSS and JavaScript. The iUI (0.31) framework is used to create the iPhone “look and feel”. We also use a small, but useful and simple toolkit called Fleegix.js to parse XML, make XHR queries and to do other cool AJAX-related stuff.

Most of the server side scripting is done. We’re now focused on finishing the UI. If we have time left, we might also add some of the extensions we talked about in the Android report (chatting with other users e.g.).

Team 6 out.

Het verslag (pdf).
Source files en apk file (zip).

Video demo van de applicatie.

Het nieuwe storyboard.

EDIT: we zijn de SQL voor de database vergeten, maar dit stond eigenlijk al in het verslag uitgelegd:

SET SQL_MODE=”NO_AUTO_VALUE_ON_ZERO”;

–
– Database: `geotrack`
–

– ——————————————————–

–
– Tabel structuur voor tabel `geo_users`
–

CREATE TABLE `geo_users` (
`id` int(11) NOT NULL auto_increment,
`user` varchar(128) collate utf8_unicode_ci NOT NULL,
`lastip` varchar(15) collate utf8_unicode_ci NOT NULL,
`time` int(11) NOT NULL,
`latitude` double NOT NULL,
`longitude` double NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=85 ;

The original plan was to simply port our Flex application to the Android platform. After questioning the usefulness of such an application, we decided to replace some features the Flex application had, by new features which are probably more useful on an Android phone.

The goal of the original Flex mashup was to visualize (and compare) popular music around the world. It’s definitely possible to port the application to the Android platform, but we don’t think anyone would want to install this and use it occasionally. The new goal for the Android app will be to find and explore the popular music and upcoming events near your geographical location.

Here’s a storyboard I’ve drawn on my laptop…

The first two tabs (“Location” and “Top Tracks”) are very similar to the Flex application. The initial location is based on the GPS coordinates, but can be changed.

I’ve left out a “Top Artists” tab, because that’s almost identical to “Top Tracks” anyway.

The “Geo Matcher” and the “Geo Roamer” are also gone, because we doubt they are interesting features for an Android app. We can’t think of many scenarios where they could be useful. So we added a “Local Events” tab, which lists nearby events (obviously…). The user can view event details like the address, music genre, artists, … by clicking on the image. Directions with Google Maps can also be requested.

Admittedly, it’s not a very creative mashup. Hopefully, we will think of new features (or different approaches) during development, just like with our Flex application.

In vergelijking met andere vakken, is het vak “Multimedia: modelleren en programmeren” behoorlijk progressief qua aanpak. De cursus is voornamelijk zelfstudie en de communicatie gebeurt grotendeels via Twitter, Facebook, Delicious en blogs als deze. De manier van lesgeven vinden wij wel een aangename afwisseling van de vele vakken die minder hands on zijn en vooral d.m.v. hoorcolleges worden gedoceerd. De “communicatiekanalen” vinden we handig, op Facebook na. Hierover meer…

Twitter

Twitter vinden we een handig communicatiekanaal voor projecten, tijdens evenementen… We zijn zelf geen grote gebruikers van Twitter en we geven toe dat we op dit moment enkel voor het vak zelf tweeten, maar we kunnen ons zeker tal van scenario’s bedenken waarin dit een heel nuttige tool kan zijn.

Sommigen beweren dat de meeste tweets weinig (bruikbare) informatiewaarde hebben, wat wel waar is, maar desalniettemin vinden we het leuk om te weten waar en wanneer iedereen met #MuMe09 (bijvoorbeeld) bezig is. Dat argument klinkt wel wat voyeuristisch, maar zo kunnen we gaan vergelijken met onze eigen hoeveelheid werk die we in het vak steken en wordt er bovendien een klein beetje peer pressure gegenereerd om aan je project door te werken.

De Twitterpagina hoef je trouwens niet telkens te bezoeken om de updates te lezen: je kan de RSS feed gewoon toevoegen aan je RSS lezer (Outlook, Thunderbird, iGoogle, …) of je kan een Firefox add-on zoals Twitbin installeren.

Facebook

Op zich is Facebook wel een leuke sociale netwerksite, maar zeker niet een goed medium om lesmateriaal door te geven. Toledo mag dan misschien niet het ideale platform voor communicatie zijn, maar alle cursusdocumenten zijn er relatief eenvoudig en snel terug te vinden. Terwijl op Facebook al je foto’s van die ene wazige avond gemakkelijk terug te vinden zijn.

Daarnaast schaadt het gebruik van Facebook voor de les ook de “credibiliteit” van het vak. Facebook wordt tegenwoordig nu eenmaal snel geassocieerd met spelletjes, zinloze status updates, “Facebook verslavingen”, …

Del.icio.us

Delicious is erg interessant om alle links omtrent het vak op één locatie bij te houden. Uiteraard is de kwaliteit van de links niet gegarandeerd, terwijl de kwantiteit dat wel is door de verplichting om iedere week links toe te voegen. Bij deze doen we dus een oproep om elke link kort en krachtig te beschrijven en te taggen (niet enkel met “mume09″). Zo kan iedereen gemakkelijker zoeken in de verzameling van mume09 links; bijvoorbeeld door zowel op “mume09″ als op “android” te zoeken.

Net zoals bij Twitter, hoef je niet speciaal tijd te maken om de mume09 links te overlopen. De RSS feed is een aanrader, net zoals de Delicious Firefox add-on.

Bloggen

De blogs vinden we het handigste “communicatiemiddel” dat we verplicht zijn te gebruiken. De voordelen zijn evident. Het enigste nadeel dat we nu kunnen bedenken is het onderhoud, maar dat vinden we eigenlijk ook een “voordeel”, omdat het ons zo wat onder druk zet om aan ons project verder te werken.

Team 6 out.