Ein Spiel, nur mit HTML, CSS und JS: „Hang The Song“

Hang ... song!

Screenshot

Ein Bildschirmfoto der Hang The Song App unter Windows 10 auf meinem Lumia 550.

Ziel des Spiels ist es, Songs nur anhand der ersten und der letzten Wörter des Lyrics zu erraten.
Ist das auf Anhieb zu schwierig, bekommst du über „Get a new hint“ zwei weitere Wörter zum Lyric hinzu.
Ein Hinweis kostet dir 10 Punkte. Pro Song hast du insgesamt 100 Punkte zur Verfügung. Sind alle Punkte aufgebraucht, ist das Spiel leider vorbei.

Am besten ist es also, so wenig Punkte wie möglich zu verschwenden und die Song-Titel zu erraten.

Kostenlos spielen

Die App ist unter lgk.io/hang-the-song erreichbar und kann direkt im Browser gespielt werden.
Sie ist auf mobile Endgeräte optimiert, kann aber genau so gut am PC verwendet werden.

Ich habe außerdem mit dem Windows App Studio herum experimentiert und so gibt das Spiel auch als Windows 10 App. Für PCs UND Smartphones!

Allerdings noch nicht im Windows Store. Wenn du die Apps aber trotzdem testen willst, kannst du das tun.


Voraussetzung ist, dass du entweder Windows 10 oder Windows 10 Mobile benutzt.

Windows 10 am PC:

  1. Stelle sicher, dass sich dein PC im Entwickler-Modus befindet.
  2. Installier das Windows Zertifikat
  3. Installier die App Hang The Song

Windows 10 am Smartphone:

  1. Stelle sicher, dass dein Smartphone Querladen von Apps erlaubt.
  2. Installier das Windows Zertifikat auf deinem Handy:
    hang-the-song-cert-install
  3. Installier die App auf deinem Handy:
    hang-the-song-app-install

Troye Sivan – Fools (Remix by Elgeekay) — Free download

cover

I made a remix of the song „Fools“ by Troye Sivan. To find out more about the original check out the official website: http://www.troyesivan.com/

You can download my remix for free. If you want to use it for any of your works, please contact me first.

Download (MP3, 2.8 MB)


Die komfortable Art, JavaScript- und CSS-Dateien zu kombinieren — mit Miniphpy

Miniphpy

In den Artikeln Traffic verringern: JavaScript-Dateien kombinieren und Website-Gestaltung: Beschleunigung durch Kombinieren von CSS-Dateien bin ich bereits darauf eingegangen, dass es Sinn macht, bei Web-Projekten CSS- und JavaScript-Dateien zusammenzufassen, um mehrfaches Abfragen einzelner Dateien zu verhindern.

Verwendet man CSS Pre-Prozessoren wie LESS oder Sass, ist es ziemlich einfach, seine Stylesheets zu kombinieren. Seit einiger Zeit nutze ich für das Kompilieren von LESS-Dateien die Anwendung Koala.

Nur für das Kombinieren von JavaScript-Dateien habe ich bisher noch keine Lösung gefunden. Und deswegen habe ich mir einfach selbst eine gemacht: Miniphpy

miniphpy-screenshot

Durch das Web-Interface kannst du deine Dateien zu Bündel kombinieren. Um auf Dateien zu verweisen, kannst du entweder einen lokalen Pfad oder eine URI zu einer Datei angeben.

Die Dateien werden dann, abhängig von der Reihenfolge, zusammgefügt und anschließend komprimiert.

Hierbei kannst du wählen, ob die Komprimierung lokal (erfolgt mithilfe von Bibliotheken, die in Miniphpy enthalten sind) oder remote (dabei werden APIs der Komprimierungs-Dienste http://javascript-minifier.com/ und http://cssminifier.com/ verwendet) passieren soll.

Da Miniphpy eine PHP-Anwendung ist, musst du Apache (z.B. durch XAMPP) auf deinem PC am Laufen haben.

Good way vs. bad way: Insert HTML elements with JavaScript

Do you prefer another way? Please leave a comment.

Neues Feature: Startmon kann jetzt Bings API für tägliche Hintergrundbilder nutzen

Startmon nutzt Bings API

Startmon v11.11

Ab sofort können registrierte Nutzer von Startmon die täglich wechselnden Bilder von Bing als Hintergrund nutzen.

Um dieses Feature zu aktivieren, gehe einfach nach „Anpassen“ » „Hintergrund“ und klicke auf „Use Bing’s image of the day“.

Da das Feature noch neu ist, würde ich gerne deine Meinung dazu wissen.
Schreibe dein Feedback gerne als Kommentar unter diesem Post oder schreib mir per Kontakt.

Melde dich nie mehr bei einer Web App an.

Nie mehr anmelden

Wie wäre das? Ich ertappe mich oft dabei, einen Online-Dienst nutzen zu wollen, es mich dann aber abschreckt, dass man sich registrieren muss.

Ich bin halt einfach zu faul dazu, meine E-Mail Adresse anzugeben, mir ein Passwort auszudenken und Angst darum zu haben, ich könnte dieses vergessen. Vor allem graust es mich davor, in Zukunft vom Anbieter vollgespamt zu werden.

Glücklicherweise bieten es mittlerweile auch viele Dienste an, sich mit Google+, Facebook oder Twitter anzumelden. Doch wie wäre es, wenn du dich gar nicht anmelden bräuchtest?

Häufig ist eine Anmeldung an einem Service nur notwendig, damit deine vorgenommenen Einstellungen erhalten bleiben. Nehmen wir als Beispiel Adobe Color CC.
Es ist ein Dienst, um Farben zu mischen und diese in sogenannten Themen zu speichern. Um den Dienst zu nutzen, ist keine Anmeldung notwendig. Du kannst ihn auch ohne verwenden. Nur kannst du die Farben dann eben nicht speichern.

Um die Farben zu speichern, musst du ein Adobe-Konto besitzen und dich anmelden. Doch wie wäre es, wenn du die Farben in anderer Form speichern könntest? Als Cookie in deinem Browser! Und wenn du die Einstellungen in einem anderen Browser nutzen willst, exportier einfach den Cookie und füg ihn im anderen Browser wieder ein.

Speicher deine Einstellungen einfach ab.

Die IcoMoon App verfolgt bereits diesen Ansatz. Mit diesem Dienst kannst du aus SVG-Dateien WebFont-Icons machen und diese in Sammlungen speichern. Es ist keine Anmeldung erforderlich. Die Einstellungen bleiben im Browser gespeichert. Du kannst die Einstellungen in Form einer config.json-Datei exportieren und in einem anderen Browser wieder importieren.

Also, ich finde dieses Konzept genial. Natürlich eignet es sich nicht für alle Anwendungen. Denn wenn die Einstellungen als Cookies gespeichert werden, sind sie leicht für andere einsehbar. Aber solange es sich nicht um sensible Daten handelt, halte ich es für völlig in Ordnung.