タグ

designとprocessに関するbitgleamsのブックマーク (38)

  • Instagramの新アイコンやUIはこうやってデザインされた

    写真およびムービーの撮影から共有までできるSNS「Instagram」がアイコンおよびUIを2016年5月11日に一新しました。サービス開始以来初となる大幅変更を行ったInstagramのデザインチームを率いるイアン氏が、どのような経緯を経て新デザインに行き着いたのかを明かしています。 Designing a New Look for Instagram, Inspired by the Community — Medium https://medium.com/@ianspalter/designing-a-new-look-for-instagram-inspired-by-the-community-84530eb355e3 Instagram Blog http://blog.instagram.com/post/144198429587/160511-a-new-look Ins

    Instagramの新アイコンやUIはこうやってデザインされた
  • Webアクセシビリティ、まず取り組むべきはカルチャーとプロセス

    2015年9月15日 著 ......てなことを最近、繰り返し考えているし、行く先々(何処)で口にしている気がします。少し前に、久しぶりにWebアクセシビリティ・ファーストのページを更新したのも、このカルチャーとプロセスが大事って話を追記したかったから。きっかけは、アクセシビリティ界隈の大家で例年きまってCSUN会場で見かけるKarl Groves氏のBlog記事、What happens when you get sued for your inaccessible website(意訳:非アクセシブルなWebサイトを理由に裁判を起こされたとき何が起こるか)。記事に出てくる見出しに、 You will never be successful in accessibility without fixing your culture and processes というフレーズがあって、まさに

    Webアクセシビリティ、まず取り組むべきはカルチャーとプロセス
  • Backdrop | UXの語感

    UXという言葉は2005年ぐらいにはすでにバズワードだったが、その後もますますバズっぷりを増している。 UXという言葉は人によっていろいろな意味で使われるとよく言われる。実際、私も仕事でいろいろな人がいろいろな意味で(そして真面目に)UXという言葉を使っているのに遭遇する。 デザインコンサルタントとしては、UXを何かひとつ定義づけることよりも、世間でこの言葉がどのような使われ方をしているのかを知ることの方が重要だ。 ちなみに、私の定義はとても簡単だ。誰かが私に「UXとは何ですか?」とたずねれば、私はこう答える。 「利用者体験のことです」 それ以上でも以下でもない。英単語の直訳で十分意味のある言葉だと思う。 例えば「デザインって何ですか」とか「UIって何ですか」といった質問に答えることの方がずっとコンセプチュアルで難しい。UXは簡単だ。 ただ世間でいろいろなニュアンスが盛られて使われているよ

  • コンテンツやデザインに欠かせない価値観を共有するプロセス

    利用者中心とは言いますが 自分たちが作りたいものを作るのは身勝手な行動のように見えますが、「自分たち」という価値(アイデンティティ)が確立されているかされていないかは大きな差があります。価値がないまま、「利用者のため」という考えだけ一人歩きしてしまうと、極度な A/B テストの実践など、数字が高いほうを選択するという製品開発になる可能性があります。 利用者中心のデザインは必要です。しかし、それは土台になる【価値観=ビジョン】があるから成り立つものであり、いきなり利用者中心のデザインプロセスを実践しても意味のないことだと考えています。スタートアップ向けの講座で ビジョンの共有が重要だと話したのもそのためです。プロジェクトを始める際は、必ずといっていいほど「我々は何者か」という部分を振り返るようにしています。 付箋には「気分が良い」「落ち着く」といった、感情的なフレーズが含まれることがあります

    コンテンツやデザインに欠かせない価値観を共有するプロセス
  • 「なんとなく」を共有する、コンテンツを活かしたデザインプロセス

    デザインを活かすためのコンテンツをどのように設計すれば良いのでしょうか。制作者やクライアントにとっての『良い』ではなく、利用者にとっての『良い』を見つけ出さなければいけません。コンテンツをつくるときのヒントになるだけでなく、デザインや雰囲気を探し当てるにも役立つ手法と注意点を紹介します。 http://www.yasuhisa.com/could/article/content-design-process/Read less

    「なんとなく」を共有する、コンテンツを活かしたデザインプロセス
    bitgleams
    bitgleams 2015/02/16
    2014年12月20日発表
  • Gitとかわかんなくても死なないです

    さいきんスクリプトわからなかったりPhotoshopしか使えなかったりするデザイナー死ぬみたいに物騒な意見を表明する人がいたり、それにおびえたりしているひとを見かけますね。SNSで。 私思うのですが、今現在わからないことって、今現在は覚える必要がないことじゃないでしょうか。人間、やらなきゃならないときこそやれるようになりますから。 つまり、今すぐやらなくてもいいようなことがやれないことでおびえたり、悩んだりしなくていいと思います。 あと、いわゆる「叱り系記事」とか「脅し口調」は、昔から出版社があえてつかう、入門者に向けた「売り文句」の典型です。だから、そういう記事を書く人はおそらく自分自身が人にgitとかPhotoshop以外の作業手段なりをセミナーとかで教えることをなりわいとしているのでしょう。だから、そういうふうに怖がらせて自分自身のナレッジの必要性を伝えているのですね。営業トークかー

    Gitとかわかんなくても死なないです
    bitgleams
    bitgleams 2015/01/30
    煽り・叱り・脅し系の啓発手法は、やり方によっては辟易してしまうこともありますね。
  • 本当のCSS設計、もしくはWebページのデザインプロセス - morishitter blog

    CSSの設計 = セレクタ名をどう付けるか、って思っている人が多いので、年も明けたしここらで一度「CSSを設計する」とはどういうことか、考えていることをまとめてみる。 セレクタ名をどう付けるか CSSのルールセットは現状全てグローバル定義なので、上手いセレクタ名を付けることで衝突を回避する必要がある。 そのための手法として、SMACSSでは.is-**とか.l-**みたいにプリフィックスを付けたり、BEMみたいに.Block__Element--Modifierのような独特な記法でネームスペースを設けたりする。 CSSは、HTMLのどの要素にどんなスタイルを当てるか、という風に宣言的に記述する言語だ。 この特性ゆえに開発者は、このスタイルをどこの要素に適応させるべきかと考え、セレクタ名を付け、HTMLの属性値に書く。 しかし、この「セレクタ名をどう付けるか」と考えることが、Webページのデ

    本当のCSS設計、もしくはWebページのデザインプロセス - morishitter blog
  • 「分からない」から始まるデザインプロセス

    分からなくて当たり前 デザインの意味がますます広がる今日。ビジネスや街作りに至るまで「デザイン」という言葉が使われているものの、実際に形作るには深い専門知識が必要とされます。 Web サイト制作も、ビジネスモデルやユーザー調査など様々な分野を理解しなければいけないですが、それだけでは完成しません。フロントエンドやサーバーサイドだけでなく、特定のアプリケーションの使い方を熟知することで、「Webサイト」が形作られるわけです。つまり、視野を拡大・縮小を繰り返すことが、デザインの学習、キャリアにおいて欠かすことができないわけです。 こうして書くのは簡単なことですが、実際に視野を拡大・縮小を繰り返して学習・実践するのは難しいです。時間は有限ですし、ゴールをイメージして情報収集したとしても、知ることができことは限られています。デザインの意味が広がり続けると同時に、デザイナーに求められる知識やスキルが

    「分からない」から始まるデザインプロセス
  • Treehouse Blog

  • ソシオメディア | UXデザインプロセスについての考え方

    UXデザインのプロセスは、UCD と呼ばれるユーザー中心設計の考え方をベースとしています。ユーザー中心設計の考え方とは、プロジェクトの各工程でユーザーを取り入れるというものです。主に、ユーザー調査の結果を要求分析に取り入れること、設計段階ではプロトタイプ制作とそのユーザー評価を行うこと、そして運用の中で継続的にユーザーからのフィードバックを収集することが重要とされ、製品/サービスのライフサイクルを通じてこれを繰り返します。つまりUXを向上させるためには、Try(試しにやってみる)と Catch(状況を把握して分析する)のセットを反復的に行うことが大切です。 これは別の言い方をすると、デザインには決まった答がなく、常に試行錯誤が必要だということです。反復的デザインは、各フェーズ単位、プロジェクト単位、そしてより大きな事業やブランドといった単位で多層的に試みることが求められています。 ウォータ

    ソシオメディア | UXデザインプロセスについての考え方
  • デザインにある繋げること、導くこと

    行程の先にあるもの コンテンツの仕事ばかりしていると、利用者のことを考えていないように思われてしまうかもしれませんが、そんなことはありません。コンテンツと利用者は切っても切り離せない関係です。以前は電子書籍としてまとめることができるくらい UX のことを書き続けてたわけですから、利用者のことを無視するなんて考えられないわけです。しかし、最近は意図的に取り上げないようにしています。 UX について頻繁に書いていたときからそうですが、「UX デザインを実践したけど、そのあとどうするの?」という疑問を常に感じていました。プロセスを踏めば、ワイヤーフレームが描けるのかといえば、そうではないことがあります。そのあと、ただ作れば完成するのかというと違うと思います。利用者のことを徹底的に考え、同意を得たからといって、利用者のニーズに応えることができるのかといえば、そんなことはないわけです。 多くの方が『

    デザインにある繋げること、導くこと
    bitgleams
    bitgleams 2014/03/26
    2014年3月25日記事
  • 切り離せないデザインプロセスと完成品との関係

    デザインの話になると、とんち問答のような展開になることがあります。 「デザインとは設計である」「装飾はデザインではない」「付箋紙貼って考えるのがデザインなの?」などなど。デザイナーの間でも、デザインのニュアンスが異なるわけですから、専門外の方が限定した意味でデザインを捉えてしまうのは当然なのかもしれません。 デザインという言葉が捉え難い理由は、デザインがもつ二元性にあると思います。デザインは、名詞としての「デザイン」と、動詞として用いる「デザイン(する)」があります。 デザイン(名詞)アイデア、加工物、プロセスを経た結果デザイン(動詞)考える、分析する、理解する、計画する、アイデアを遂行する名詞としてのデザインと動詞としてのデザインは、別々に存在するものではなく、相互関係にあります。そして、相互関係であるからこそ、良いデザインが生まれると考えられています。デザインには二つの意味があるのでは

    切り離せないデザインプロセスと完成品との関係
  • コンテンツ提案を生み出す対話のポイント

    今のコンテンツの状態を書き出す「Content Inventory (コンテンツ・インベントリー)」は、Webサイトだけでなく、アプリ開発の際にも役立つステップです。ひとつひとつの画面を見ているだけでは気付かなかったことも、表にしてまとめると、重複していたり、古かったり、間違った情報が表記されているところが見つかりやすくなります。 コンテンツ講座でもインベントリーの重要性と始め方を解説したものの、難しいのは数百ページ分のコンテンツを表にまとめて調べるところではありません。当に難しいのはそのあとどうするのか?という部分です。例えば、重複コンテンツや Web には適さないライティングが増えないようにするための処置はできます。 ワークフローの見直し: CMSの機能を使うだけでなく、組織の誰がどのようなタスクをするのかを確認する ライティングガイドラインの制定: 文章の構成から、Web に適した

    コンテンツ提案を生み出す対話のポイント
  • らくだをデザインしていませんか?

    A camel is a horse designed by committee. (ラクダとは委員会によって設計された馬である)Alec Issigonis らくださんがかわいそうですが、いろいろなアイデアを盛り込むことで結果的に何がなんだか分からない不細工なものが出来てしまうという意味が込められています。「We just made a camel(らくだをつくってしまった)」という表現を使う場合がありますが、語源は上記の格言になります。デザインの決定権をもっている人がたくさんいて、彼等の意見をすべて取り入れてしまうことで最初のビジョンとはかけ離れたものになってしまう・・・なんとも人ごとではないシナリオです。 以前「デザインが失敗してしまう理由」でもデザインをしない方や知識のない方が決定権をもつことが失敗に繋がると紹介しました。プロジェクトに携わっているのであれば誰でも言いたいことはあり

    らくだをデザインしていませんか?
  • Re:Cre Vol.14 | Web design process for the future

    ーーーーーーーーーーーーーーーーーーーーーーー schoo WEB-campusは「WEBに誕生した、学校の新しいカタチ」。 WEB生放送の授業を無料で配信しています。 ▼こちらから授業に参加すると、先生への質問や、ユーザーとのチャット、資料の拡大表示等が可能です。 https://schoo.jp/class/234/room ーーーーーーーーーーーーーーーーーーーーーーー

    Re:Cre Vol.14 | Web design process for the future
  • 利用者の期待とUIデザインについて

    UI デザインとひとことで言ってもたくさんのことを考慮しなければいけません。単一機能のシンプルなアプリの設計だったとしても、UI の課題は山のようにあります。私自身、どこから始めたら良いのか分からなくなることがありますが、UI デザインを考える始めるために、ふたつの疑問を自分自身に問いかけるようにしています。 利用者が期待に応えられるようなインターフェイスはなにか? 利用者が目的に辿り着く為の明確な道筋はなにか?

    利用者の期待とUIデザインについて
  • Web Design Process for The Future

    組み合わせ利用でいいとこ取り! Adobe XD+Photoshop+Illustratorの長所を活かしたデザイン手法を学ぼうAkiko Kurono

    Web Design Process for The Future
  • One Size Fits None

    Who doesn’t love to talk about process? Every week, it seems, someone has discovered “the new way to work that everyone should be doing.” While I love a healthy process debate, I find discussions that promote a one-size-fits-all design approach problematic. They tend to minimize all of the nuanced decisions we make and oversimplify our complicated jobs. They also don’t take into account that each

    One Size Fits None
  • 情報アーキテクチャの脊髄を視覚化

    2月9日に東京で開催された World IA Day 2013 に参加してきました。前回の記事 で書いた今後の IA の課題のヒントになるようなメッセージを、イベントを通して幾つか見つけることができました。 今回は吸収した内容を自分なりにインフォグラフィックにしてみました。 イベントを通して『情報』にはデータベースに蓄積できるようなものと、掴み所がないものと二種類あると考えました。言い換えれば右脳的な情報と左脳的な情報があるといったところでしょうか。まったく違う存在のようにみえる二種類ではありますが、4つの段階を踏んでアーキテクチャ(構造)を作り出しているようにみえました。 Deconstruct (分解) Sort(分類) Compose(構成) Adjust(調整) つまり、感情やニュアンスといった掴み所のない情報だったとしても、ビッグデータを活用した情報の解析だったとしても、進むべき

    情報アーキテクチャの脊髄を視覚化
  • Where to Start | Trent Walton

    When making the transition to building responsive websites, the hardest part can be getting started. I get my fair share of questions about how to choose a direction and chart out the first few steps from industry comrades and potential clients. It can seem daunting, so I thought I’d attempt to sum up a few of my own current thoughts on the matter. Consider RWD From the Beginning. I believe this s

    bitgleams
    bitgleams 2013/02/12
    via @cssradar 『コンテント、デザイン、コード、ブレークポイント、グリッドという5つの視点でどうレスポンシブデザインを初めて行くかについて短い言葉でまとめている。』: https://gist.github.com/studiomohawk/4758873