タグ

designに関するvine_hateのブックマーク (22)

  • さよなら、さよなら、デザイン思考|KESIKI

    こんにちは、KESIKIの石川 俊祐です。 今年の10月にIDEOのレイオフのニュースが出ました。驚いた方も多かったのではないでしょうか。 このニュースによって、「デザイン思考はもう終わりなのでは?」という意見を耳にします。アメリカの経済メディアFast Companyも「Design giant Ideo cuts a third of staff and closes offices as the era of design thinking ends(意訳:デザインの巨人IDEO、デザイン思考の時代の終わりに伴いスタッフの3分の1を削減しオフィスを閉鎖)」という記事をあげています。 しかし、当にデザイン思考が“終わった”と言えるのでしょうか。 もしデザイン思考が終わったとして、これからのデザインはどのような役割を果たすのでしょうか。 そんな話を書いていきたいと思います。 「デザイン

    さよなら、さよなら、デザイン思考|KESIKI
  • PayPay App Style Guide - PayPayアプリスタイルガイド

  • ルールではなく補助線 ─ユーザー数2,000万人超のサービスにおける、Design Systemを立ち上げた話|Mercari Design Blog

    ルールではなく補助線 ─ユーザー数2,000万人超のサービスにおける、Design Systemを立ち上げた話 こんにちは、メルカリDesign Systemの立ち上げと運用を担当したデザイナーのtottieです。 この記事では、メルカリの抱えていたデザイン上の課題をDesign Systemの導入で改善したお話をご紹介いたします。 なぜDesign Systemを導入したの?Design Systemを導入した理由は、大きく分けて2つあります。 1つめは、開発における課題です。 導入を決定した当時(2018年)、メルカリはスタートアップから急成長したサービスだったため、開発チームは様々な課題を抱えていました。 サービスを改修したくても、複雑に絡み合ったコードのためアップデートが難しい状況になってきた。 急激なチームメンバーの増加にあたり、分担して作業するための土台の整備が間に合わなくなっ

    ルールではなく補助線 ─ユーザー数2,000万人超のサービスにおける、Design Systemを立ち上げた話|Mercari Design Blog
  • 《2018年版》メルカリが独自開発した「デザイン思考フレームワーク」について | キャリアハック(CAREER HACK)

    デザイン思考を実践する、メルカリ 2018年11月現在、世界で1億人超がダウンロードし、1,133万人のMAUを誇る『メルカリ』。 サービス開始から約5年。現在、彼らは「デザイン思考」の実践を志向する。そもそも「デザイン思考」とは何か。捉え方からジャスパーさんは解説をしてくれた。 「デザイン思考は、正しく問題を解決する考え方のことです。重要なのは、いかにお客さまに向き合い、その考えや課題を理解、共感していくか。そこから得られた問題を定義し、解決できるプロダクトをつくっていくか」 続けて、メルカリによるデザイン思考の実践手法について。 「通常、デザイン思考は「ダブルダイヤモンド(*)」というフレームワークが用いられることが多いです。ただ、このフレームワークはどんなプロダクトにも当てはまるわけではないので、メルカリでは、3つの手法にカスタマイズして実践しています」 1.Understandei

    《2018年版》メルカリが独自開発した「デザイン思考フレームワーク」について | キャリアハック(CAREER HACK)
  • 安全安心にソフトウェア開発を行うためのDesign Doc導入ガイド|面川泰明

    みなさん、コードを書く前に設計書を書きますか? 書くか書かないかは人それぞれだと思いますが、「設計」というプロセス自体は意識的であれ無意識的であれエンジニアであれば全員やっていることだと思います。 今回は設計プロセスの改善という文脈で私たちがDesign Docという仕組みを導入したことについて共有しようと思います。もし同じような状況を経験している人がいたら参考になれば幸いです。 導入の背景まずは導入するに至った状況からお話します。 私たちのサービスは、利用していただくユーザーの数が増加しています。それに伴って品質のハードルも上がってきました。サービスに障害が発生するとユーザーさんに大きな損害を出してしまうことになるからです。そこで今まで以上に安全にサービスを開発できる仕組みづくりが必要になりました。ですが、実現のためには大きく2つの課題がありました。 課題1. 開発スピードが徐々に鈍化し

    安全安心にソフトウェア開発を行うためのDesign Doc導入ガイド|面川泰明
  • 技術文書の書き方

    howto-tech-docs.md 技術文書の書き方 このメモは、私(@ymmt2005)が長年にわたってソフトウェアプロダクト開発に関わってきて 2022年現在こうしたほうが良いと考えているベストプラクティスです。 科学的な分析等に基づくわけではない経験則であるため、今後も随時見直すことがありますし、 ここに書いてあることが常に正しいわけでもあらゆるソフトウェア開発に適するわけでもありません。 しかしながら、実務経験が豊富で、モダンな技術スタックに明るいエンジニアの経験則は一定の 役に立つのではないかと考えて記します。 技術文書とは ここでは、ソフトウェア開発で技術者が書くべき文書ということにします。 ソフトウェアエンジニアにも役割がいろいろあり、アーキテクトと independent contributor では書く文書が違うということはあるでしょうけれど、ここではごっちゃにします。

    技術文書の書き方
  • 2019 Design Tools Survey

    Sign up for the newsletter Join 70k+ other subscribers and get updates on next year's survey! You'll also get the latest articles directly in your inbox.

  • Mobile design trends to watch out for in 2020

    Reading back this post from December 2018, it seems that not much has changed, and many of the trends are still happening: chromeless designs, gestures, gradients, deep flat, big bold fonts, and more, they are still here and will remain dominant during 2020. Here’s a closer look at some new mobile trends that will continue to grow in 2020: 1. Dark modeYep, I know that’s old news already, but you k

    Mobile design trends to watch out for in 2020
  • 課金 UI まとめてみた|あき - 良いもの作って正しく届ける

    売上を伸ばしたい。 課金率を伸ばしたい。 でも、難しい! コンバージョンするサブスク UI を勉強したかったので、いくつかのアプリをスクショ。あたまの整理にまとめたのでアップ。 Web の LPO はかなりノウハウ系記事がありますが、アプリのサブスク UI は、まだまだ少ない気がします。誰かの参考になれば嬉しいです。 まとめ内のコメントは個人的感想です。まだまだ勉強中なので、お気軽にご意見いただけるとうれしいです。 ※ スクショは少し前に撮影したものなので、一部古くなってるかもしれません。 UI パターン 1. ミニマム型 2. プラン比較型 3. 横スクロール型 4. リスト型 5. ロング LP 型 規約表示パターン 1. 固定表示型 2. 隠しスクロール型 3. フッター型 4. 遷移型 サービスパターン 1. 探索財 2. 経験財 3. 信頼材 UI パターン1. ミニマム型最低限

    課金 UI まとめてみた|あき - 良いもの作って正しく届ける
  • 『色の決まりを知っていれば「センス」がよくなる』

    システム会社に「色はとりあえず適当にお願いします」と言ってあがってきたものを見ると「えーっ」という配色になってあがってくることがよくある。「適当に」と指定していない自分が悪いのだが色をすべて指定しないと使ってはいけない色の組み合わせを使ってきてしまうのだ。 という私も初めて自分でチラシのデザインを作った時は「韓国風の色遣いだね」とつっこまれたが、緑や赤の原色を多様してしまった。(韓国の色づかいが悪いと言っているのではありません)そこでデザイナーさんに進めてもらったのは配色辞典。そこにあげられている色を使えばたちまちセンスの良い色遣いができるようになるのだこれホントに。 たとえば参考サイトは http://www.colourlovers.com/ これを見ると3色とか5色の色があげられているのでその色の組み合わせを使ってあげるとセンスがよくなる。 ああ、なんと便利な。ちょっと知ってるだけで

    vine_hate
    vine_hate 2007/02/27
    [color]
  • //// COLOURlovers :: loving colours since 1981

    Share Your Color Ideas & Inspiration. COLOURlovers is a creative community where people from around the world create and share colors, palettes and patterns, discuss the latest trends and explore colorful articles... All in the spirit of love.

    vine_hate
    vine_hate 2007/02/27
    [color]
  • Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download!

    by Alessandro Fulciniti In November 2005 I presented on pro.html.it a three-part article on creating CSS layouts using techniques like negative margins, any order columns and in some case opposite floats. The main goal of the article was getting the maximum number of layouts based on the same markup, each with valid CSS and HTML, without hacks nor workaround and a good cross-browser compatibility.

    vine_hate
    vine_hate 2007/01/23
    [レイアウト] [css]
  • プログラマでも出来るWebデザイン - Blog.37to.net

    home blog labs about contact プログラミング・開発 > プログラマでも出来るWebデザイン (X)HTML CSS テンプレート デザイン 画像 作成: 2007-01-08T01:58:41+09:00 更新: 2009-04-29T09:48:31+09:00 年始早々に大幅リニューアルした当ブログですが、リニューアルのお知らせでも書いた通り、 今回のデザインリニューアルに当たっての作成過程や、使ったツールを書いていきます。 デザインセンスの無い私にとって、今回のリニューアルは良く出来たと自負しているので、 お題はプログラマでも出来るWebデザイン。 前提として、CSSでコーディングが出来て、ある程度HTMLは設計出来る、でもデザインは・・・orz な人を対象にしています。 使用したツール・サイト一覧 作成過程は後半に書くとして、今回使用したサイト・ツールで

    vine_hate
    vine_hate 2007/01/09
    [web]
  • ウノウラボ Unoh Labs: デザインセンスの無い人がwebサイトを作成する際に参考にしているサイト

    こんにちは satoです。 いくら面白くて、高機能なwebサイトを作成しても、デザインがダサいとサイトの魅力や開発意欲は半減です。 僕もまったくデザインセンスが全く無いのですが、新しい物を作成する際には以下のサイトを参考にしています。 (1)Color Scheme Generator 2 デザインの大まかな配色等を決めるのに使用することがあります。 真似するだけで、Coolなサイトに見えるような気がします。 (2)Color Palette Generator ロゴ等の画像を指定すると、その画像に合ったカラースキームを 教えてくれます。 (3)Web 2.0 Colour Palette 有名なサイトのカラースキームの一覧があります。 (4)pmob.co.uk CSSや画面分割などのさまざまなサンプルや解説があります。 (5)logopond さまざまなロゴのサンプルがありま

    vine_hate
    vine_hate 2006/11/28
    [web]
  • 5000枚以上の写真やイメージ画像が無料で利用できる「Stockvault.net」

    ダウンロードできる画像数は現時点で5425枚、カテゴリ数は93、全合計で3432MB(約3.4GB)もの大容量のフリーストックフォトギャラリーです。解像度は1280x960から1800x1200までとなっており、全体的に割と高め。個人利用に限りフリーで、自由に使うことができます。 さらに今は「The Best Stock Photo of 2006」という賞金1000ドルのコンテストを行っており、そこにノミネートされた高品質な画像も自由にダウンロードできるようになっています。 ダウンロードの仕方などは以下の通り。 free stock photos and images - stock photo resource - stockvault.net http://www.stockvault.net/ 全カテゴリには以下からアクセスできます。 Categories / Descriptio

    5000枚以上の写真やイメージ画像が無料で利用できる「Stockvault.net」
  • Web2.0風サイトを作るのに必要なモノあれこれまとめ - GIGAZINE

    Web2.0とは何か?というと、いろいろな解釈に基づいていろいろとあるわけですが、デザインという切り口で見てみるとある共通項が存在することがわかります。 例えばそれは、シンプルなレイアウト、中央に寄せる構図、ちょっとした3次元空間を感じさせる効果、白やパステルカラーと言ったソフトな色調の背景、アクセントには鮮やかワンポイントカラー、アイコンを多用したわかりやすい使ったナビゲーション、大きなフォントなどなどであるわけです。角の丸いテーブルなどはその代表です。 というわけで、Web2.0風なサイトデザインへリニューアルする際に参考となるサイトや、その素材を製作するためのサービスなどを集めてみました。 まず、Web2.0風デザインとはどういうものかについては以下のサイトにまとめられています。先ほど書いたのはこのサイトで触れられていることがメインです。 Current style in web d

    Web2.0風サイトを作るのに必要なモノあれこれまとめ - GIGAZINE
  • Webデザイン・Webデザイナーのまとめサイト | Webデザインに優れたサイトのリンク集 ≪デザインリンクデータベース≫

    ~10程度っすよ ~50程度かな ~100くらい ~300程度です ~500はこなす ~1000はやってます これ以上 ( ! )

  • 画像が簡単にできるジェネレーターいろいろ :: Love & Design ::

    ブログにちょっと画像がほしいなぁというときに便利なジェネレーターを集めてみました。 専用ソフトがなくても、簡単にあっという間にできちゃうのがいいですね。 ImageChef(日語対応になりました) こちらは ボムガール | ブログに使えそうなジェネレーター で紹介されていたのですが、なんと75種類あります。 mixi のプロフィールにも使えそうですね。 関連 テキストでハート型などの画像が作れるジェネレーター Web2.0 Logo Creator by Alex P Web2.0 っぽいロゴ E-Zombie.com ゾンビがロゴを作ってくれる Vinyl Record Generator 誰でもレコードが作れるジェネレータ。音楽好きの方はぜひ。 Create Fake Magazine's covers 海外の新聞・雑誌風 どうぞご利用ください。

    画像が簡単にできるジェネレーターいろいろ :: Love & Design ::
  • 高品質でフリーのウェブサイトテンプレート集「TemplatesBox.com」 - GIGAZINE

    通常のウェブサイトだけでなく、Flashサイトのテンプレートやロゴマークのテンプレート、バナーやボタンまで置いてあります。これらがすべてフリーというのが驚き。全部で200個以上あるようです。 TemplatesBox.com http://www.templatesbox.com/ ウェブサイト用テンプレートは利用したPSDファイルやフォントも同梱されており、DreamweaverかFrontpageで編集しやすいようにできています。 ウェブサイト用テンプレートあれこれ http://www.templatesbox.com/templates.htm ロゴデザインのテンプレートはPSDファイルとフォントファイルが同梱されています。親切。 ロゴデザインのテンプレート http://www.templatesbox.com/free-logo-templates/index.htm ウェブサ

    高品質でフリーのウェブサイトテンプレート集「TemplatesBox.com」 - GIGAZINE
    vine_hate
    vine_hate 2006/07/18
    [web]
  • Javascriptで指定のHTML要素を動的に角丸デザインにする方法:phpspot開発日誌

    Nifty Corners This is the original article. The technique has been improved with better browser support and a lot of new features. The new article has been published on the 6th of April 2005. Javascriptで指定のHTML要素を動的に角丸デザインにする方法。 NiftyCornerを使えば、単一のDIV要素を角丸デザインにすることが可能です。 例えば、次のような単一DIV要素も簡単に角丸にできます。 <div id="nifty"><p>test</p></div> <script type="text/javascript"> Rounded("div#nifty","#377CB1","#9

    vine_hate
    vine_hate 2006/03/15
    [css] [javascript]