これは便利！ HTMLはdiv要素一つ、あとはCSSをコピペするだけで100種類のツールチップを簡単に実装できる -CSS Tooltips & Speech Bubbles

2024/03/06 206 users CSS HTML ツールチップ div要素一つ グラデーション

HTMLはdiv要素一つだけ、あとはCSSをコピペするだけで約100種類のールチップとスピーチバブルを実装できるCSS Tooltips & Speech Bubblesを紹介します。 このツールチップって実装すると、けっこう面倒ですよね。ベタ塗りのツールチップをはじめ、グラデーションの枠、しっぽの位置、しっぽの形状など、さまざまなデザイ... 続きを読む

デザイナーが知っておくべき10の認知バイアス デザイン会社 ビートラックス: ブログ

2022/03/11 647 users ビートラックス 認知バイアス デザイナー 近道 性別

認知バイアスとは、思考のプロセスにおける系統的な間違いのこと。簡単に言い換えると、思い込み。意思決定や判断を行う際の精神的な近道として機能するが、間違った判断を生み出すこともある。 年齢、性別、文化的背景に関係なく、誰もが認知バイアスの影響を受けていると言われる。 これを理解しておくことは、デザイ... 続きを読む

ITCSSを採用して共同開発しやすいCSS設計をZOZOTOWNに導入した話 - ZOZO Technologies TECH BLOG

2021/08/13 125 users ZOZOTOWN 菊地 CSS設計 リニューアル ウェブ

こんにちは。ZOZOTOWN部フロントエンドチームの菊地（@hiro0218）です。 2021年3月、ZOZOTOWNは10年ぶりのリニューアルをしました。この記事では、そのリニューアルで再考したCSS設計について紹介します。 背景 今回のリニューアルでは、ウェブとアプリが部分的に共通のデザインになりました。 アプリ ウェブ このデザイ... 続きを読む

サンプル例でわかる！注目したい2020年のWebデザイントレンド8個まとめ - PhotoshopVIP

2019/11/18 68 users PhotoshopVIP ウェブデザイン 翻訳 ピックアップ

海外サイト 99designs で公開された 8 innovative web design trends for 2020 より許可をもらい、翻訳転載しています。 この記事では、これから2020年に注目したいウェブデザインの最新トレンド8個をピックアップ、予想しています。「アッと驚かすデザインをつくりたい。」そんな思いにさせてくれる、たくさんのデザイ... 続きを読む

Slack のロゴが新しくなりました！ | The Official Slack Blog

2019/01/16 828 users Slack ロゴ スペイン語 リニューアル計画 疑問

この記事を英語、フランス語、ドイツ語、スペイン語で読む。 本日、ブランドデザインのリニューアル計画の第一弾として、Slack では新ロゴを発表しました。Slack 社員だけでなく、ユーザーの皆さんにも愛されてきた以前のロゴ (とデザイン) をなぜ変えるのか、疑問に感じる方もいるのではないでしょうか。そこで、デザイ... 続きを読む

Zeplinがかなり便利！Adobe XDやPhotoshopからデザインの指示書やスタイルガイドを簡単に自動作成できる | コリス

2018/10/26 56 users Zeplin コリス Photoshop Adobe XD

Webサイトやスマホアプリのデザインの指示書やスタイルガイドをわざわざ作成するのは時間がかかり、なかなか面倒です。Adobe XDやPhotoshopなどで作成したファイルから、Zeplinでこれらを自動生成する方法を紹介します。 Zeplinは1プロジェクトまで無料で利用できます。Adobe XDにもデザインスペックという機能でデザイ... 続きを読む

「大きすぎるiPhoneは女性差別」著名フェミニストたちがAppleを批判 - iPhone Mania

2018/09/24 552 users iPhone フェミニスト iPhone Mania 批判

手に収まるiPhoneが欲しいのに、なぜAppleはiPhone SEを販売終了してしまったのか――中には“大きすぎる”iPhoneを女性差別だと考える消費者もいるようです。 女性の手のサイズからは乖離している イギリスでは女性の権利向上を訴える運動家（フェミニスト）や政治家が、「iPhoneは女性にとって大きすぎる」「様々なデザイ... 続きを読む

文字や背景にピュアブラックを使ってはいけない理由 | UX MILK

2018/08/20 722 users UX Movement UX MILK 統計 眼精疲労 成人

UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。。 デザインにピュアブラックを使うと可読性が低くなると知っていましたか？ 統計によると、「アメリカの成人の58％」がコンピュータ作業で眼精疲労を経験したことがあるそうです。デザイ... 続きを読む

新旧の北欧デザインを一度に楽しめる「北欧デザイン展」開催、「バルト3国の雑貨たち」も同時に | タブルームニュース

2017/11/17 86 users 新旧 一度 タブルームニュース 北欧デザイン バルト３国

新旧の北欧デザインを一度に楽しめる「北欧デザイン展」開催、「バルト3国の雑貨たち」も同時に 2017/11/15 11月21日(火)から27日(月)までの1週間、 東京 ・ 新宿 の「 伊勢丹新宿店 」にて、「 ～北欧のルーツといま～ 北欧デザイン展 」が開催されます。 日照時間が短いことから、家の中を彩り、長い冬を豊かに過ごす北欧。そんな北欧で長く愛される伝統的なデザインと洗練された現代のデザイ... 続きを読む

無料で商用利用できるSVGのフリーアイコン4,500種類、デザインに合わせたカスタマイズもできるのはすごい！ | コリス

2017/11/10 558 users コリス SVG コマース 商用 カスタマイズ

企業サイトをはじめ、コマース、アプリ、メディア、ブログなど、さまざまなUIデザイン用のアイコンが無料でダウンロードできるOrion Icon Libraryを紹介します。 その数はなんと4,500種類以上！ 豊富なデザイ ...記事の続きを読む 続きを読む

ロゴデザイン、２２の確認すべき大事なこと – TOMOKO UJI – Medium

2017/08/21 117 users medium 予習 精度 用途 ワークショップ

ロゴデザイン、２２の確認すべき大事なこと 22 important things to check for logo design, thinking for creating design guidelines. 9月に ロゴデザインのワークショップ をやることになりまして、予習の意味も兼ね、久々のデザインエントリーです。 「長く使える」「様々な用途に使える」「時を重ねてその精度が増す」「デザイ... 続きを読む

商用利用可能！フリー(無料)ダウンロードできるアイコン素材50個まとめ 2017年3月度 - PhotoshopVIP

2017/03/02 54 users PhotoshopVIP ウェブデザイン 絵柄 役割 見た目

ウェブデザインやアプリ用デザインを作成するときに、シンプルな絵柄や絵文字が重要なデザイン要素のひとつで、利用には細心の注意を払う必要があります。アイコン素材は見た目を良くするだけでなく、サイトやアプリを使いやすしてくれる役割があります。 今回は、 無料ダウンロードできる良質アイコン素材セットをまとめてご紹介 します。アウトラインスタイルのエレガントな素材から、フラットスタイルの鮮やかで大胆なデザイ... 続きを読む

デザイナーを採用する時には、仕事を分解して何をする人を採りたいか考える必要がある by 古川 健介 | Supership's Blog

2017/02/09 195 users 健介 手触り デザイナー ギャップ クリエイティブ

デザイナーを採用したい！ インターネット企業において、デザイいうのは非常に重要です。エンジニアと同様、とてつもなく大事なクリエイティブの戦略ですし、アプリ時代になり、手触りや使いやすさををあげていくために最前線で戦う人です。 しかし、デザイナーを採用したい！となったときに、デザイン知識がない人がやると、よくギャップが起こりやすいです。僕も、デザイナーではないので、いまいち詳しくわかっておらず、面接... 続きを読む

数千ページのワイヤーフレームを書いてきたWebディレクターがUI設計時に気を付けている８つのこと。 - 笑顔を創りたいWeb屋の日常

2016/12/05 1203 users ワイヤーフレーム www.adventar.org ボク

2016 - 12 - 05 数千ページのワイヤーフレームを書いてきたWebディレクターがUI設計時に気を付けている８つのこと。 【スポンサーリンク】 list Tweet なんかすごい思い付きで www.adventar.org に参加してみたんですけども。 気づいたらいつの間にか自分の日になっていて 面倒くさくなってきて激しく後悔した びっくりしたという。 ぼくはWebディレクターでありデザイ... 続きを読む

必見!ノンデザイナーがデザインの基礎を学ぶための記事9選！！ - またろぐ

2016/01/07 91 users ノンデザイナー 必見 基礎 参考 デザイン

2016 - 01 - 07 必見!ノンデザイナーがデザインの基礎を学ぶための記事9選！！ まとめ シェアする Twitter Google+ Pocket 私自身デザインをしっかり学んだことはありません。 そこで、私を含めノンデザイナーの方などが参考にできるような記事をまとめてみました。 デザイン基礎 まずはデザイン関係初心者が読むべき記事をまとめた記事のご紹介です。 これらを読むことで、デザイ... 続きを読む

【新国立競技場】ザハ・ハディド氏、コンペ参加断念へ　組むゼネコン見つからず（コメント全文）

2015/09/18 118 users ゼネコン ザハ・ハディド氏 アーキテクツ ZHA コンペ

見直し前のデザインを手がけたザハ・ハディド氏が、新たな新国立競技場のコンペ参加を断念――。ザハ・ハディド氏の事務所「ザハ・ハディド・アーキテクツ」（ZHA）がハフポスト日本版に9月17日、送付したコメントで明らかになった。コメントでは設計・施工を一体として募集する今のコンペのルールについて、「参加を望んでいる多くの建築家を制限している」と批判。「スタジアムを建設できる施工業者が限られ、我々のデザイ... 続きを読む

誰もがアナログ盤をつくれる！ しかもリスクゼロで!? LP・EP制作・販売プラットフォーム「QRATES」がローンチ « WIRED.jp

2015/04/24 59 users QRATES トラックメイカー ローンチ アナログレコード

2015.4.24 FRI 誰もがアナログ盤をつくれる！ しかもリスクゼロで!? LP・EP制作・販売プラットフォーム「QRATES」がローンチ 本日4月24日にローンチした、アナログレコードのカスタム制作サーヴィス「QRATES」。その使い心地を、ユーザー第1号となったDJ／トラックメイカーのCarpainterに聞いてみた。 「QRATES」のレコード制作画面。選んだ盤の色もジャケットのデザイ... 続きを読む

「王将を歩兵が守る」広告に将棋ファンが総ツッコミ　「完全に『二歩』」 : J-CASTニュース

2015/01/09 474 users 歩兵 王将 J-CASTニュース 総ツッコミ 将棋

2015年1月5日発売の経済誌「週刊東洋経済」（1月10日号 東洋経済新報）に掲載された広告にネットユーザーからツッコミが入っている。 広告は金融・企業情報を分析、配信する「トムソン・ロイター・マーケッツ」（東京都港区）が出稿し、海外へ進出する日系企業向けに規制やリスクなどの情報を提供するサービス「トムソン・ロイター・アクセラス」をPRした。 「めちゃめちゃ弱いやぐら」 将棋をモチーフにしたデザイ... 続きを読む

京都の地下鉄キャラクター「太秦萌」はなぜ“進化”した？ デザイン会社と交通局に聞く制作秘話 - はてなニュース

2014/07/04 525 users 太秦萌 小野ミサ 松賀咲 制作秘話 進化

京都の地下鉄に登場した、キャンペーンキャラクター「太秦萌」「松賀咲」「小野ミサ」の3人。以前のキャラクターデザインから“進化”を遂げ、ネット上では「かわいい」「京都が本気を出した」と話題を集めました。そんな太秦萌について、プロデュースを担当したデザイン会社・GK京都と、京都市交通局に制作秘話を伺いました。中には、キャラクターの“裏設定”や気になる今後の展開も。記事の最後には、太秦萌たち3人をデザイ... 続きを読む

中国で開発された「絶対に寒くないスクーター用コート」がおかしい - ねとらぼ

2013/11/21 61 users とらぼ 中国 パーン スクーター カード

寒さが厳しくなってきて、スクーターに乗る方には辛い季節になってきました。スクーター乗りの多い中国では「絶対に寒くないスクーター用コート」が開発されましたが、これがいろいろおかしいです。 バーン！ 風の抵抗を受ける胸、腕、膝など正面を完全にガード。その素材もモコモコで実に合理的ですね。ってなんだよこれ！　宇宙服か！ すごい正面戦士っぷり 確かに暖かそうですが、実際に着るのは色々勇気がいりそうなデザイ... 続きを読む

ディレクターとして見ておくべき、デザインチェックポイント5つ | 株式会社LIG

2013/11/05 86 users ディレクター 株式会社LIG LIG 食欲 視点

こんにちは。あかねです。 食欲の秋がやってきました！ せっせかとパンやケーキを作ってはLIGに持ってきてみんなに食べてもらってます。 この秋が過ぎたらみんな太ってるといいなｗ ディレクターの仕事の一つ。デザインチェック。 デザイナーさん、エンジニアさんに作りたいものを伝えて出来上がってきたものをチェックするのもディレクターの仕事の1つです。デザイナーさんが見る視点とは違うポイントを見ることでデザイ... 続きを読む

Vagrantを使ってローカルでWordPressを立ち上げる | Dress Cording

2013/07/08 93 users MAMP Vagrant Dress Cording オーラ

とにかく私がやりたかったことは、Wordpressをローカル環境に構築して思う存分デザインがしたい！テーマのバージョン管理がしたい！ということ。そこで @machidaさんに相談してみると・・・「"Vagrant" にしましょう。」 え？！なんだか難しそう。。プログラマ界隈では当然の技術なんだろうな〜。MAMPでいいですかなんて言えないオーラ。 でもWordpressのローカル環境くらいならデザイ... 続きを読む

制作会社を頼らずWordPressでホームページを作るメリット10個

2013/04/22 571 users WordPress ホームページ 制作会社 メリット10個

WordPress（ワードプレス）なら安く簡単にプロ顔負けのデザインでホームページを作れます。少ない予算に悩みながら、頼れる業者をムリヤリ探している人は自作してみてはいかがでしょうか？やってる商売の規模が小さくて、ホームページにあまりお金をかけられない。そんな人に「ぜひ！」お勧めしたいのがWordPress（ワードプレス）を使った自作です。 WordPressを使えば、安く簡単にプロ顔負けのデザイ... 続きを読む

シームレスに使える、ざらっとした渋い感じのテクスチャ用の素材 -WeGraphics | コリス

2013/04/10 115 users コリス pat psd シームレス フォーマット

個人でも商用でも無料で利用できる、ちょっと渋い感じのざらっとしたシームレスなパターン素材を紹介します。 Subtle Distress Photoshop Patterns ダウンロードできる素材のフォーマットは、下記の通りです。 PSD (800x800px) PAT (Photoshop用のパターン素材) 両方ともシームレスです。 アイテムは全部で、10種類。 渋い色合いで、グランジ風のデザイ... 続きを読む

2013年試してみたい、フレッシュなウェブデザインのテクニック | コリス

2013/02/19 190 users コリス ウェブデザイン ストックフォト ビーチ サーモン

ウェブデザインの基本はおさえつつ、フレッシュでクリエイティブものを取り入れたい！ そんなデザイナーに役立つテクニックを紹介します。 Fresh and Creative Web Design Techniques 下記は各ポイントを意訳したものです。 はじめに ホワイト/ネガティブスペースをもっと ピーチとサーモン より大きいのがベター イメージを動かす ストックフォトは使わない はじめに デザイ... 続きを読む