Mediamatic Developers blog
Onze core en front-end developers delen graag hun kennis. In deze blog publiceren we over ons eigen werk en interessante items die we in de wereld tegenkomen.
Jonathan
De Iphone Alleycat applicatie is gebaseerd op de traditionele Alleycat races. Deze fietsrace moet via verschillende checkpoints worden afgelegd naar de finish. De route tussen deze checkpoints mag de racer zelf bepalen. Om deze race zo goed mogelijk af te leggen is niet alleen snelheid, maar ook de creativiteit en de navigatievaardigheid van de fietser belangrijk.
Dit artikel moet een beeld vormen van mijn flow/interactie ontwerp voor de Iphone Alleycat app. Onderaan dit artikel is er een link naar een clickable mockup.
Met dank aan Sara Kolster en Maarten Wolzak.
Hoe werkt het?
ArjanPrinting a badge
What's the easiest way to create and print badges from Anymeta
This article goes into the different alternatives for creating and printing badges for events which are hosted from an Anymeta site.
Requirements
- Easy to use and configure by frontend developers
- Badge generation should be fast
- Create multi-paged PDFs with multiple badges in one file.
- People at home might self-print their badge
Current situation
The current situation is nicely summarized by Kerim. We currently use the fPDF library with manual scripting to tweak the margins, fonts etc.
Pros of PDF badges:
- single-file download
- less chrome when printing
- page breaks are easy
Cons of PDF badges:...
JeanaHTML5 training: notes from the audience
What I learned at work today
-
HTML5 seems promising but without good IE and other browser support implementing it now could just be a headache... Kerim made this picture to illustrate the conclusions of his research.
- Kerim started off the training - he looked at ...
HTML5 is the newest version of HTML. From what I heard today, it actually reintroduces many of the features of early versions of IE that were never implemented in other browsers. HTML5 re-engineers these to be more stable in all browsers at least eventually when HTML5 is supported by all browsers...
The presentations identified some of the nicest features of HTML5, those which might be worth implementing now, and what we should think about for the future.
The Presentations and their blog posts
KerimHTML5 Training (Web Forms 2.0)
Research on enhanced forms
This part of the training looks at the advantages, disadvantages and use cases of web storage. Other parts available include research on drag and drop as well as the Web Storage API.
A greatly welcomed addition to the HTML5 spec are new input types, allowing future versions of browsers to validate certain input without having to use Javascript as well as providing users with soft-keyboards a more specialized keyboard layout.
general input types
The email input field provides the user with a soft-keyboard with a layout that highlights buttons that are required to enter email addresses most often:
The numbers input field, like the email input field, provides a specialized keyboard, this one focusing on number entry:...
HTML5 Training (Drag and Drop)
Research on Drag and Drop
This part of the training looks at the advantages, disadvantages and use cases of drag and drop. Other parts available include research on Web Storage as well as the enhanced usage of forms.
Drag and drop support in browsers, initially conceived by Microsoft's Internet Explorer team in 1999, is slated to become an official part of the HTML5 spec, as outlined by the W3C. Drag and drop enables users to utilize interfaces in a more human way, by allowing items to be both dragged and dropped, as one would do in real life to sort items or data.
drag and drop
Drag and drop is, according to Peter-Paul Koch, one of the most widely respected voices on HTML and related technologies, broken, stating that:
You MUST NOT use HTML5 drag and drop. Rely on old-school scripts instead....
HTML5 Training (Web Storage)
Research on Web Storage
This part of the training looks at the advantages, disadvantages and use cases of web storage. Other parts available include research on drag and drop as well as the enhanced usage of forms.
One interesting addition to the HTML5 spec is web storage, a (better) way of storing data, both for long- and short term use.
Web Storage consists of two items that share most of their feature set with each other: for long term storage, there is localStorage, for short term storage, sessionStorage ought to be used. Both solutions could be considered cookies on steroids, as they provide most, if not all, features cookies provide, while at the same time not being limited to an extremely low 4KB limit.
localStorage
localStorage enables a developer to store a large amount of data i...
De ikCam Alleycat is een race voor fietsers die bestaat uit verschillende checkpoints. De rijder mag zelf de route tussen deze checkpoints bepalen. Om deze race zo goed mogelijk af te leggen is niet alleen snelheid, maar ook de creativiteit en de navigatievaardigheid van de fietser belangrijk.
Het idee
Het idee van Mediamatic was om een Alleycat race in Amsterdam te organiseren met een verrassend spelelement, namelijk het gebruik van de ikTag en de ikCam’s. De ikCam’s worden gebruikt als start, finish en checkpoints. Het resultaat is een RFID-versie van een traditionele Alleycat. Om de race te rijden krijgt de deelnemer een ikTag en een manifest in de vorm van een spoke card uitgereikt. Daarop staan d...
ikPod prototype #1
iPod + IkTag = IkPod
Some quick imagery on our latest prototype. The pictures show the casing, made out of PU casted around the iPod and custom electronics. We decided on using a transparent cast as to show the bare bones of the system.
-
Back side showing antenna and RFID circuit.
-
Front side, showing the iPod embedded in the PU cast.
-
Detail of the connectors (USB, power and audio out).
Explaining the principles of resource sharing between websites using the publish/subscribe paradigm.
Over the last year you might have heard, either through me, Ralph Meijer or through the grapevine, about the stuff we do at Mediamatic related to the resource sharing technologies we're developing. This resource sharing is a part of our ongoing efforts to create a federation of social networks using a number of open web standards, the collective of which we've dubbed Open-CI. At Mediamatic, we impleme...
Move that profile!
Debugging the AnyMeta Account migration system
Debugging is a hard job, and not the most fun there is. Especially when working on Open-CI, Mediamatic's system which let different websites interact with each other. This interaction of websites is very nice and works quite intuitive, however, because there are multiple sites involved, it can be a pain to debug.
Take the Migrate module. When enabled in your website, it allows you to physically move your account from the site you're currently at, to another site in the Open-CI network. Very nice functionality, but quite complex. After some bug reports from our users, we had to turn off the module a month ago because it contained a bug which in a few cases caused a failure: In the middle of the migration process, a message showed up: "Account creation failed", after which the migration process was abruptly ended, leaving a confused user behind.
To see what was exactly going on, I decided to draw a little schematic about th...
