タグ

2016年9月23日のブックマーク (11件)

  • 流行なんて関係ない!いつでも使える黄金ウェブレイアウトUIパターン12個まとめ

    海外サイトUXPin Studioで公開された「Web Layout Best Practices: 12 Timeless UI Patterns Analyzed」の著者 Jerry Cao より許可をもらい、翻訳転載しています。 ウェブサイトを訪れるユーザーの多くは、コンテンツを楽しみにしており、デザイン目的で訪れているわけではありません。 この記事では、いつの時代にもマッチする、12種類の黄金ウェブレイアウトパターンを問題点や解決法、具体的な使い方のポイントと一緒に見ていきましょう。 コンテンツ目次 01. カード型レイアウト 02. グリッドレイアウト 03. マガジンレイアウト 04. 枠なしレイアウト 05. スプリット・スクリーンレイアウト 06. 単一ページレイアウト 07. F型パターンレイアウト 08. Z型パターンレイアウト 09. 水平方向の左右対称パターンレイア

    流行なんて関係ない!いつでも使える黄金ウェブレイアウトUIパターン12個まとめ
    japanitnt
    japanitnt 2016/09/23
  • CSSの単位(em, rem)を使った、これから取り入れていきたい実装テクニックのまとめ

    CSSの相対的な単位(em, rem)を使って、Webページで使われるUIコンポーネントのさまざまなサイズを変化させるスタイルシートのテクニックを紹介します。 em, remは文字の大きさだけでなく、画像やアイコンのサイズ、背景、フォーム、ボタン、配置など、さまざまな指定に利用できます。 Building Resizeable Components with Relative CSS Units 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 フォントのサイズを変化 縦と横の比率を維持したボタン 縦と横の比率を維持した画像 box-shadowを使ったボーダーの幅と高さ アイコンの幅と高さ、そして間隔も キャプション付き画像 装飾された背景 アイコン付き検索フォーム チェックボックスで実装されたトグル ブロックの一行の長さ ボタ

    CSSの単位(em, rem)を使った、これから取り入れていきたい実装テクニックのまとめ
    japanitnt
    japanitnt 2016/09/23
  • BALMUDA (バルミューダ)の電気ケトルThe Pot が発売される?「これは買い!!」 - blancoo house

    こんにちは! 少し肌寒くなってきて、 電気ケトル を買い換えようかなーなんて思っている方も多いのではないでしょうか? 今まで、 電気ケトル の記事の中で紹介していて、わたし自身も使用していたこちらがおすすめだったのですが、 ラッセルホブス 電気カフェケトル 1.0L 7410JP posted with カエレバ Russell Hobbs (ラッセルホブス) Amazon 楽天市場 Yahooショッピング それを超えそうなケトルが 「あのデザイン家電メーカーからもうすぐ発売されそう!」 という情報をゲットしました!さっそく紹介していきますね。 「これは買い」な電気ケトル!BALMUDA (バルミューダ)The Pot が発売される? ー 集英社 FLAGSHOP(フラッグショップ) より いかがですか?めっちゃかっこよくないですか??さまざまなサイトで探したのですが、 集英社 FLAGS

    BALMUDA (バルミューダ)の電気ケトルThe Pot が発売される?「これは買い!!」 - blancoo house
    japanitnt
    japanitnt 2016/09/23
  • Suicaやスマホの装飾に? NFC通信時に発光するLEDモジュール1枚あたり税込270円、発光色は赤、青、緑の3色

    Suicaやスマホの装飾に? NFC通信時に発光するLEDモジュール1枚あたり税込270円、発光色は赤、青、緑の3色
    japanitnt
    japanitnt 2016/09/23
  • 『「くまモン」デザイナーに発注のロゴ540万円は高すぎ? 「30万円が適切」奈良の住民訴訟に批判も』へのコメント

    ブックマークしました ここにツイート内容が記載されます https://b.hatena.ne.jp/URLはspanで囲んでください Twitterで共有

    『「くまモン」デザイナーに発注のロゴ540万円は高すぎ? 「30万円が適切」奈良の住民訴訟に批判も』へのコメント
    japanitnt
    japanitnt 2016/09/23
  • NY市、情報Kioskのブラウザ機能を停止 – 島田範正のIT徒然

    いろんな意味で世界最先端の街、ニューヨーク。羨ましいなあ、と思いつつ、今年3月に紹介した最新サービスがありました。それがこれです。 写真中央にあるのがLinkNYCが、公衆電話ボックスに替えて、今年1月から設置を進めている情報Kioskです。高さ3メートルのスリムで洒落たタワーには、ネット時代にふさわしい機能が詰め込まれています。こうなっています。 機能を番号順に紹介します。①は超高速のWi-Fi発信部②ビルトインされたタブレットで、ブラウジングが出来ます③無料電話機能です。タブレット画面でIP電話のVonageのアプリを使うか、タブレットの右下にあるテンキーとマイクで米国内ならどこへ掛けてもタダ。公衆電話機能が無料になって残っています。④電話用のボタンの左にある赤ボタンは日の110番にあたる「911」専用です⑤モバイル機器の急速充電が出来るUSBポートが二口あります。 そして⑥このステ

    japanitnt
    japanitnt 2016/09/23
  • ベテランの大工さんに学ぶ、一人前のデザイナーの条件 - Tortoise Shell

    Webデザインを学ぼうとした時、PhotoshopやHTMLなどの「デザインの手段」についてのカリキュラムは豊富ですが、「デザインの思考」について学べる方法が少ないことに気が付きます。 デザインは来、意匠計画・設計という意味なので、「作る」ことと同じくらい、「考える」ことも重要であり、その2つの力を備えて初めて一人前のデザイナーと言えるのではないでしょうか。 PhotoshopやHTMLといった技術そのものは、あくまでオペレーション(作業)の問題なので、デザインの勉強とは言えません。 それらの技術を極めても、AdobeオペレーターやHTMLコーダーになることはできますが、デザイナーとしての能力を身につけることはできないと考えます。 では、一人前のデザイナーとは何かと考えたときに、その例えとして最もイメージしやすいのがベテランの大工さんです。 大工さんが極めているのはノミやカンナだけではな

    ベテランの大工さんに学ぶ、一人前のデザイナーの条件 - Tortoise Shell
    japanitnt
    japanitnt 2016/09/23
  • 2,000球が音を奏でる複雑で有機的な楽器『Marble Machine』そのローファイな製造工程 | FUZE

    Photo: Samuel Westergren デジタル時代のヒーローになるのに、なにも複雑なプログラミングの知識や遺伝子組み換えといったような技術は必ずしも必要ない。 木工の授業で習った知識と情熱、工具と作業スペースと時間と、そしてなによりアイデアさえあれば(2,000個ほどビー玉サイズの球があってもいいかもしれない)、素敵な楽器を作れてしまう。 そんな書き方だと、あまりにもこの『Marble Machine』を過小評価してしまうことになるかもしれない。何はともあれまずは「Ars Electronica Festival 2016」(アルス・エレクトロニカ・フェスティバル)で展示された動画で、この機械の動く様を見てみよう。 ハンドルを回すと流れ落ちてくる球により琴や絃が弾かれ音を奏でる作品『Marble Machine』は、まるでサイレント映画のための音楽や効果音を演奏するためのフォト

    2,000球が音を奏でる複雑で有機的な楽器『Marble Machine』そのローファイな製造工程 | FUZE
    japanitnt
    japanitnt 2016/09/23
  • 「くまモン」デザイナーに発注のロゴ540万円は高すぎ? 「30万円が適切」奈良の住民訴訟に批判も

    奈良県で2017年に開催される「国民文化祭」のロゴマークをめぐって、540万円の制作費が不当に高すぎるとして県内の市民団体「見張り番・生駒」メンバーらが9月16日、奈良県に対して住民訴訟を奈良地裁で起こした。「30万円程度が適切」だとして、差額の510万円を損害額と主張。奈良県に対し、同祭実行委会長の荒井正吾知事に請求することなどを訴えている。 ロゴマークは、「くまモン」などを手がけた著名デザイナー、水野学さんが制作した。実行委が2016年3月に水野さんが代表の会社「good design company」と随意契約を結び、すでに事前イベントなどで使用されている。鹿の周囲を花鳥風月が囲む円形のロゴで、奈良県の色である蘇芳(すおう)色とモノクロの2種類が制作された。

    「くまモン」デザイナーに発注のロゴ540万円は高すぎ? 「30万円が適切」奈良の住民訴訟に批判も
    japanitnt
    japanitnt 2016/09/23
  • デザイナーは抽象と具象の間を這いずり回る - not simple

    前回デザインについて感性と論理の2軸で書いたのですが、抽象と具象の2軸も良く考える話だな、と。 けっこう常に意識的にしている観点なのですが、社内のデザイナー向け勉強会で使う「新人デザイナーにデザインのレビューをするときに注意してる10のこと」みたいな資料をまとめている際に 「具体的で細かい指摘をしている直後に突然抽象度の高い話を振って混乱させて惑わせる思考を活性化させる」みたいな章があったので、改めて言語化しておこうというものです。 具象化すること、抽象化すること デザイナーにとって抽象化する力と具象化(具体化)する力を兼ね備えている(もしくはきちんと意識している)というのはジャンルに限らずすごく大事だと思っていたりします。 まあすごく雑にいうと「ふわっとしたものの質を捉え(抽象化)、目に見える形にする力(具象化)」を持っている、みたいなかんじでしょうか。 具象化する力 こちらは比較的わ

    デザイナーは抽象と具象の間を這いずり回る - not simple
    japanitnt
    japanitnt 2016/09/23
  • 現役エンジニアが教える!優秀なWebエンジニアへと引き上げてくれる10のツール

    現役エンジニアが教える!優秀なWebエンジニアへと引き上げてくれる10のツール これからエンジニアとして活躍したい人必見の10のツールを紹介。優秀なWebエンジニアになるためには実務の経験やプログラミング言語の知識だけでなく、世の中の便利なツールも知っておきたいものです。作業効率もあがるのでぜひチェックしておきましょう。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査 稿は、Codementorのブログ記事を、了解を得て日語翻訳し掲載し

    現役エンジニアが教える!優秀なWebエンジニアへと引き上げてくれる10のツール
    japanitnt
    japanitnt 2016/09/23