Velo is a full-stack development platform that empowers you to rapidly build, manage and deploy professional web apps.
フロントエンドエンジニアとデザイナーさんは日々協力してプロダクトを作っていく関係にあります。デザイナーさんが作ってくれたものをエンジニアが素早く実現できるよう、いくつかエンジニアから意識してほしいことをまとめました。 なんでこんな話になったのか(前置きなので次の章まで飛ばしてOKです) デザイナーさんから「この画面をこんな風に作ってください」とXDやSketch、PSDなどいろいろな形で渡されることがあると思います。 僕の個人的な意見・経験ですが、いざ実装するぞとなったときに 「あれ…ここってどうしたらいいんだろう?」 と迷って作業のスピードが落ちてしまうことがとてもストレスに感じていました。できればノンストップでいきたいなあと思うわけです。 手が止まるたび、デザイナーさんに「ここってどうしたらいいですか?」と質問するのが何か新しい画面を作るときに必ず発生していました。 「(いつも聞いてる
ベイジで社内のワークフローを整理しだしたのは確か2014年頃です。その頃はまだ4~5人しか社員がいない状態で、タスクの粒度も粗く、いくつかのタスクは各人の能力に委ねたものでした。しかし10人を超えて関わる人が増えたあたりから、仕事の進め方も徐々に変わり、ワークフローの綻びも色々と出始めてきました。そこで今年の春に、全社員参加のもと、これまでの進め方の問題点を話し合ったうえで、ワークフローの大幅な刷新を行いました。本エントリーはそのご紹介です。 刷新にあたって、受注から納品までをサブタスクを含めて約140に分解しました。また、各タスクで用いられるドキュメントもできるだけフォーマット化し、効率よくドキュメントワークができるようにしました。 合わせて、タスク毎の職能の再定義を行いました。プロデューサー、ディレクターといった業務範囲が曖昧な職能は、より厳密な職能の定義を試みました。例えばディレクタ
リリース AdFlowがYahoo!広告とのAPI連携により、バナー制作、入稿審査、効果分析をワンストップで実現。 2022.02.08 広告審査データの連携により「AdFlow」上で審査状況の確認も可能に。制作から運用まで、ひとつのクリエイティブに紐づく全てのデータ・コミュニケーションを一元管理することで、更なる広告効果向上に寄与します。 「クリエイターが輝く社会を創造する」をビジョンに掲げ、広告業界で「教育・制作・開発」の3つの領域にわたりクリエイティブに関わるサービスを展開している株式会社クリエイターズマッチ(本社:東京都渋谷区、代表取締役:呉 京樹、以下「クリエイターズマッチ」)は、クリエイティブ特化型プロジェクト管理ツール「AdFlow(アドフロー)」とYahoo!広告とのAPI連携を開始したことをお知らせします。これにより、「AdFlow」上からYahoo!広告へのバナーの自動
「コデアル」という求人サービスのデザインシステムを作ってみました。CIリニューアルに伴う全スタイル&コンポーネントの刷新、エンジニア&デザイナー間の協業、そして約3ヶ月運用してみた感想をつづってみます。 実際に使っているドキュメント、Sketchファイルはこちら↓ ・Codeal Design Guideline ・Codeal UI Kit.sketch ・Sketch Tips for Codeal Design Guideline Codeal Design Guidelineの中身はこんな感じ。 1. デザインシステムとは組織やサービスの形態によって解釈は分かれると思いますが、私はデザインシステム=ブランド、設計、開発をつなげるガイドラインだと認識しています(引用:結局デザインシステムは何なのか) スタイルガイドやテンプレートだけではなく、それらをチームでどう活用するかを言語化して
こんにちは。サービスデザイナーの佐藤 史です。 サービスデザインには、さまざまな専門的メソッドが存在します。サービスデザインの普及に伴って最近ではさまざまな書籍が発行されたりセミナーが開催され、皆さんが所属されている企業や団体の中でも実際にサービスデザインの手法を試みられたり、ツールを活用される機会も多くなっているのではないでしょうか。 しかし同時に、ツールを使うこと自体が目的化してしまったり、本来の意義を踏まえずにやり方の部分だけを表層的に真似してしまったりすることで、やってみたはいいけど効果や成果を実感できなかった、というようなケースも見受けられるようになってきました。 どんなに優れた手法・ツールであっても、使う局面や目的を間違えると、期待した成果は得られません。 そこで、本稿では、コンセントが普段関わっている多くのプロジェクトの中で、よく使われていて、かつ専門性の高い手法・ツールにつ
最近、相談を受ける事が多いデザインマネージャーの役割を経験をもとに書き出してみました。長いですが、迷った時の辞書代わりに使ってもらえるとありがたいです。 ここでは会社の規模が30名以上、デザイナー5名程度を超えた組織をイメージしてます。ユーザー体験に責任を持つサービスデザイン責任者と組織責任者の話は混同しないほうが良いので、今回は組織責任者にフォーカスしてます。 全体のストーリーはこのスライドで掴めると思いますが、もう少し具体的に実行した事などをリスト化したので参考になればと思います。 デザイン責任者として実行した事まとめデザイン責任者の仕事は何かを学ぶために行動してみた ・実績を上げてる会社へ一週間研修に行かせてもらい、成果をあげてる理由を分析して、100ページ位のレポートを作った。 ・池田さん、土屋さん、深津さんなど有識者に相談して感覚を掴んだ。 ・それらの行動は自分自身の勉強にもなっ
I wanted to share my Sketch workflow designing on an 8 point soft grid. If you are not familiar with this concept please read Bryn Jackson’s great article on 8pt Grids first. http://spec.fm/specifics/8-pt-grid I have a fairly unique workflow, adding color coded guides right inside my artwork. This process was heavily inspired by the Material Design Guidelines Defining the MetricsI have a set of Sh
私たちの会社では長らく、画面設計といえばPowerPointを使い、ワイヤーフレーム(以下、WF)を作っていました。Web制作会社における非常にスタンダードなやり方であったため、ベターな方法と受け入れつつも、例えば以下のような無駄も多く、決してベストではないとも感じていました。 設計者がコーダーに文書構造の意図を説明する時間の無駄 設計者が考えたファイル構造やヘッダ情報を定義するためのドキュメントの無駄 コーディング時にWFやPSD上のテキストをコピペして移し替える無駄 リンク構造や動き、使い勝手を紙面上で表現しようとする努力の無駄 共通パーツに修正が入った時に各ページごとに修正を入れていく無駄 PC用とスマホ用の2種類のWFを作る無駄 更新するたびに新しいWFを印刷する紙の無駄 いずれも工夫次第で軽減できる問題でしたが、意思疎通のための中間成果物の体裁を整えるための多くの時間が無駄では?
Webは面倒くさくて、本当にイケてない。 わたしはWebデザイナーとして働いているので、Webについての色々な事を当たり前だと思い込んで何の疑問も抱きませんでした。 しかし、冷静に考えてみると、おかしいことだらけだと思います。 Webデザイナーは、デザインするのが仕事です。 コンテンツの魅力を最大限にエンドユーザーに伝えるべく、情報をデザインしています。 つまり、Webデザイナーは「コンテンツの質を高めること」に注力しなければならないのです。 しかし、現状はどうでしょうか。 人間ではなく検索エンジンに優しいWebサイト 本来ならデザインに集中すべきなのに、なぜブラウザの差分に振り回されたり、SEOを気にしながらWebコンテンツを作らなければならないのでしょうか。 ブラウザもSEOも「手段」であるはずなのに、わたしたちはいつもその「手段」に振り回されています。 特に、SEOなんてひどい話だと
最近、Adobe製品を全部消してしまって仕事しています。Adobe製品ではない、次世代ソフトで仕事をしていますが、Webデザイナーがいわゆる「脱Adobe」するとどうなるかなどを書いてみたいと思います。第3回目は実際に「脱Adobe」してみてでてきた課題を書いてみたいと思います。 「Sketch」でUIカンプデータを作成するときに問題になるのは、データの受け渡しです。コーダーやフロントエンドエンジニアがMacユーザーなら、「Sketch」を使ってくださいといえば問題ないのですが、Windowsユーザーなら多少問題があります。 現在「Sketch」を利用している案件はカンプデータをPDFとPNGでエクスポートしてコーダーやフロントエンドエンジニアに渡しています。データ自体も作業指示を記載したもの、作業指示を記載していないもの、2種類を渡しています。 「Sketch」ではCSSも書き出せるため
マーケティングとデザインの共通点 2015年6月27日大阪 Re:Creator’s Kansai 主催のイベント「基礎からきちんとマーケティング」に登壇しました。デザイナーとして働いているのでマーケティングは畑違いのように見えますが、以前からマーケティングを扱った記事をたくさん書いています。カスタマージャーニーマップのようなマーケティングの手法がデザインプロセスの一部として採用されていたり、デザイン思考がマーケティングに取り込まれているなど、共通するところが幾つかあります。 例えば UX を学んでいるうちに行動経済学に興味を持つ方もいるでしょう。行動経済学はデザインにも取り込める興味深い学問ですが、マーケッティングを深く知る上でも役立ちます。デザインとマーケティング両方に興味をもつことは、デザイナーとしてごく自然のことではないでしょうか。人のこと、市場のこと、社会のことを知らないとデザイ
横に伸びる棒グラフのようなラインを使うことで作業の進捗状況や生産管理が行いやすくなっている表のことを「ガントチャート」と呼びますが、Googleカレンダーに登録している予定をガントチャート化して、一目でタスク管理できるのが「GANTTplanner」です。 GANTTplanner: Turn your Google Calendar into a Gantt chart https://www.ganttplanner.com/ Googleカレンダーからガントチャートを作るには「GET STARTED」をクリック。 GANTTplannerはGoogleカレンダーの情報をインポートするのでGoogleアカウントでのログインを求められます。Googleカレンダーの情報からガントチャートを作りたいアカウントでログインして、「承認する」をクリック。 GANTTplannerのトップページが開
2. モック作る次に、Illustrator でモック作る。前は Photoshop で作ってたけど Illustrator に変えた。ラフスケッチでだいたいの構造は決まってるので、それを画面で見た時の見栄えを検証する。雑だけどこれは自分のサイトなのだから自分しか見ないという前提があって、雑でも問題ないということにしてる。8割くらい作り込んだところでやめて、コーディングに入るようにしている。2割くらい変更可能な余地を残しておくことで、コード書くとき融通が効く。 ラフとかモック描かずにコーディング始めることもたまにあるけど、それは余程デザインが頭のなかで固まっている場合に限る。ラフとかモック作るの、コーディングと同じくらい大事だと思ってて、コーディングを始めてしまうとデザインに気を配るのを疎かにしがち。デザインを考えつつ同時にコードを書くというのは結構難しくて、トレーニングが要る。全体のデザ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く