网站推荐:用Twitter玩音乐 – 独立乐队Brightly的geek玩法

tweetflight

有这样一支独立乐队,Brightly,他们以一种有趣的形式推出了他们的新MV:

tweetflight.wearebrightly.com/

他们的做法很“geek”,用HTML5的<video>标签全屏播放视频,在通过调用Twitter上和每句歌词部分匹配的tweets作为字幕滚动播出,同时给出每条tweet的出处和时间。

无论效果如何,至少它是一次不错的玩法,而不是一成不变的音乐电视形式。它的歌词是“活”的。

尽管有朋友问,那有什么意义?

再一次感到,就因为什么事情都喜欢探究“它到底有什么意义”,意义太沉重,我们也许错过了很多“just for fun”的fun。

让我感到糟糕的地方也许也是他们故意的,这个MV没有任何的控制选项,我只能选择把它看完听完或者是把网页关掉。

tweetflight

音乐结束后,它会引导你去音频社交网站SoundCloud去听Preflight Nerves这首音乐,以及到官网音乐页面进行购买,你也可以参与他们的the BEGINNINGS & ENDINGS project

the BEGINNINGS & ENDINGS project

这个页面最失败的地方,就是误导,你以为可以点的地方,基本上都是不可以点的。或许应该换一种设计的方式。起码可以加入一些交互元素,比如让鼠标上移时给出一些tooltips。

尽管如此,the BEGINNINGS & ENDINGS project本身的推广手段也挺有趣,点击“VIEW THE MAP”,再点“WANT A CODE”就可以填表参与,你会获得一个游戏代码和邀请链接,如果有十个人通过你的邀请参与这个“游戏”,你将获得一张专辑。

the BEGINNINGS & ENDINGS project

感兴趣的朋友请点击以下地址接受我的邀请:
beginnings.wearebrightly.com/join/2dX

这个“游戏”主要功能使用了Leaflet这个开源的JavaScript库,用于制作对移动设备友好的互动地图。Leaflet的Github地址是:
github.com/Leaflet/Leaflet

Brightly的官网做得很聪明。你会发现,他们真的很依赖并善用社交网络和第三方服务,让自己的网站集中力量实现更有趣的事情,而不是一味将所有的资源,都堆在自己的网站上。

Brightly

在Brightly的官网,你可以清晰的了解到,除了调用了他们Twitter帐号上的tweets,给出了他们的Facebook入口,而且其在其他内容上,新闻用Tumblr发布,视频调用YouTube的,音频在SoundCloud上,照片在Flickr上,用CreateSend实现邮件列表……

他们的网上商店用的是bigcartel这个服务。

他们的官网上关于行程的部分也挺有趣,

Brightly

是一个基于Google Maps和Google Calendar的mashup。

虽然大量地调用站外内容和利用第三方服务所实现的功能,从而让网站制作本身更加高效和灵活,但是也非常考验设计功力,因为搞不好,就只是笨拙臃肿的堆砌。

Brightly官网采用了One Page Web Design的方式,排版干净,风格明快,用CSS3的 transition 和 box-shadow 来制造鼠标上移后的发光效果。

而这个官网所用的UI框架,居然是Twitter Bootstrap,一时没看出来,是一次非常不错的定制。

JS框架除了jQuery外,还用了Backbone.js以及上次介绍「最多人同时在线玩的炸弹人HTML5网页游戏 – Bombermine」时提到的Underscore.js

随着互联网的发展,音乐的消费形式已经发生变化,CD会想过去的卡带和更早的黑胶那样,会很快消亡,而且速度可能比我们想象的快。

于是聪明的音乐人,自有聪明的玩法。

我们会陆续看到更多的尝试。

王力宏也在自己的官网上提供专辑「十二生肖」的付费下载了。(ps.原来王力宏的官网是用WordPress搭建的!)。

更早之前,也了解到一些歌手以手机app的形式推出专辑。

希望看到更多有趣的音乐商品。

点击浏览Brightly官网:
wearebrightly.com/

(如果不能正常访问,可以留言索要梯子的邀请,梯子不是我的也不是免费的,但是我正在使用,非常好用)

欢迎在GeeKaaHTML5讨论版分享更多有趣的HTML5玩意。

来源:http://blog.linz.im/2013/brightly.html