タグ

2016年5月29日のブックマーク (3件)

  • かっこいい―路線図が電子回路になった「東京回路線図」ICケース [インターネットコム]

    東京の鉄道路線図がそのまま電子回路になった「東京回路線図」。男心をくすぐるデザインのICカードケースが登場した。大阪府の電子技販という企業が取り扱う。 東京回路線図が生まれたきっかけは、電子技販が業である設計製造業のかたわら廃基板のアクセサリーを作って展示会に出し、雑貨バイヤーの目にとまったこと。 その後、自社しかできない商品を作ろうと考え、東京の鉄道路線図が基板の回路図に似ていることからデザインに取り入れ、いちから基板CADで設計、製造、部品を実装し、「名刺入れ」を作ったところ、20歳代以上の男性に人気を博した。 今回のICカードケースは、SuicaなどIC乗車券を入れられるようになっており、名刺入れよりいっそう鉄道と親和性が高い製品といえるだろう。 基板の配線パターン各路線を描き、西エリアは「横浜駅」、北エリアは「大宮駅」、東エリアは「西船橋駅」まで網羅。東京湾に大型船が浮かべている

    かっこいい―路線図が電子回路になった「東京回路線図」ICケース [インターネットコム]
    hachi09
    hachi09 2016/05/29
  • Redirecting

    hachi09
    hachi09 2016/05/29
  • 背景画像に変色するグラデーション背景を重ね合わせるサンプル

    今回のTipsでは、Webページの背景(background)にアニメーションしながら色が変化していく「グラデーション背景」とフルサイズの「背景画像」を重ね合わせて表示するサンプルを作ってみたいと思います。CSSのみでできて、とってもシンプルです。 まずは完成イメージをご覧ください! See the Pen Gradient animation background with full size image by digistate (@digistate) on CodePen. CSS3では、1つのbackgroundプロパティのみで、複数の背景要素(画像,カラー)の重ね合わせができるのですが、今回のサンプルではアニメーション(変色)するグラデーション背景と、静止画像の背景を重ね合わせるため、それぞれの背景は異なる要素に指定しています。 具体的には、以下の背景レイヤー構成です。 背景レ

    背景画像に変色するグラデーション背景を重ね合わせるサンプル
    hachi09
    hachi09 2016/05/29