Webデザインの有料学習サイトが無料化 IllustratorやPhotoshop入門などが見放題
chot.design上のコンテンツは、実際にWeb／IT企業で働いている現役のクリエイターが制作したものという。ちょっと社代表の小島芳樹さんは自身のTwitterアカウントで「変なオンラインサロン入る前にここで勉強してみてください！」とアピールしている。 無料公開を決めたのは同サービスの運営から手を引くため。現在は全レッスンの無料公開と共に、有料サービスの利用者に対して返金対応を行っている。 ちょっと社が取り組んでいたデザインやフロントエンド開発の受託事業が急激に成長した影響で、chot.designに手が回らない状況が続いた。今後はサブスク型プログラミングスクールを提供するDonbler（東京都渋谷区）が事業を継承するとしている。 関連記事 穴埋め問題を簡単に作れるWebサイト、「試験勉強に役立つ」と話題に 教育系IT企業のCTOが作成 マウスやタッチ操作で直観的に穴埋め問題を作成でき
時短してますか？Web制作が変わる最新オンラインツール38個まとめ
日頃の忙しい業務を少しでも楽にしたい、効率化したいと考えている人にぴったりな、Web制作で使える最新オンラインツールをまとめてご紹介します。 コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。 カテゴリごとに整理しているので、制作フローに新しく追加してみてはいかがでしょう。 コンテンツ目次 1. Web制作便利ツール 2. 配色ツール 3. デザインコレクション 4. プロトタイプ、アイコンツール 5. コラボ、リモートワークツール 6. 面白、クリエイティブツール Web制作の効率、生産性アップ！話題の最新オンラインツールまとめ Web制作便利ツール クリックで一発コピペできる、120種類以上のCSSボタンを集めたライブラリ。3Dやグラデーション、レトロな
もうデザイナーいらないって言われた話【無料デザインツールCanva】 - Qiita
みなさま、こんにちは。 プラコレアドベントカレンダー2019も折り返して、8日目。 冒険法人プラコレのデザイナーzukaです。 （投稿が遅れてしまいました。本当に申し訳ございません。） なんだかんだとデザイナー歴３年目。 少しずつ社内で力になれることも増えて、毎日充実しております。 令和初のクリスマスも間近に迫り、 女性率の高いプラコレ社内は一層明るい会話も飛び交っておりますが、 先週、信じられない発言が私の耳をつんざきます。 “もう、自分でつくれちゃうから” えぇ…………。 私たちはDressy（ドレシー）というブライダル系メディアを運営しており、 多くの花嫁さまのハートをきゅんとつかむようなコンテンツを 365日毎日発信し、業界へ新しい価値を提供しております。 なかでもデザイナーの役割といえば、 良質なグラフィックを作り出し、企画を盛り上げること。 かつての広告バナー100000000
Illustratorの代わりにAffinity Designerを使う
Adobe Illustrator を CS4 から 10 年以上使っているんですが、そろそろ Adobe にも飽きてきたので他の選択肢を探してみようと思い色々休日に調べていました。 探してみると選択肢は非常に少なく、フリーの Inkscape か有償の Affinity Designer のどちらかを選ぶという状況です。 Affinity Designer も有償と言えど 6,000 円程なので、たったの CC1 ヶ月分です。 https://affinity.serif.com/ja-jp/designer/ Affinity という名前は初めて聞いたのですが、多くの Illustrator の機能をサポートしている上に、公式サイト・ヘルプが日本語に翻訳されており敷居も低いです。製品ラインは 3 つ用意されており、 Affinity Photo: Adobe Photoshop の代替
ブサイクなUIデザインを劇的に改善するための10のチェックリスト｜Taiki IKEDA｜note
お久しぶりです、イケダです。UIデザインをする上で、これらを意識するだけでビジュアルの質が劇的に向上するというチェックリストを作ってみました。UIデザインの参考にしてください。 左右の余白は揃っているか 左右の余白をしっかり揃えることは最も初歩的で、カンタンに実践できるTipsです。あまりに初歩的すぎて悪い例を探すのに苦労しましたが、MoneyF●rwardさんが題材として非常に優秀でした。左右の余白は14~20ptの間で揃えるのが定石です(迷ったら16ptにしておこう)。どうしても左右の余白を持て余してしまうという場合は右の改善例のように中央揃えに逃げるのも手です。 フォントの大きさは正しいか fontサイズはまず、「読ませるテキストの大きさ」を決めてから、それを基準に組み立てていきます。読ませる文字、webでいう<p>タグは14~16ptに設定し、その文字とのバランスを見て<head>
Sketch移行とUIコンポーネント化で、良いことしかなかった話
アプリやWebのUI制作では、もうSketchに完全移行したという方も多いのではないでしょうか。VASILYで開発・運用しているファッションサービス「IQON」でも、昨年の夏頃から徐々に移行を開始し、現在はほぼすべてのUI制作をSketchで行えるようになりました。 そこで今回は、Sketch移行を進めた際の「デザインのコンポーネント化」のポイントや、その恩恵をお話したいと思います。 デザインデータの属人化、という問題IQONは2010年にサービスを開始・運用してきたため、デザインデータの量がかなり多く、最新のデータがどこにあるのか分かりづらかったり、デザインデータのつくり方が「属人化」していたことが問題となっていました。 サービスの成長にともない2015年頃から徐々にデザイナーが増えてきましたが、新しいデザイナーが入った際すんなり作業を開始することが難しかったり、急対応が必要な際に作業し
歴史から考えるフラットデザインとマテリアルデザインの違いとは？
もし私がこれから、フラットデザインとマテリアルデザインの違いが視覚上ごくわずかであると発言しても、不愉快にならないでください。 実際、この話題についてあまり知らない人は、どちらのデザインに対しても、とても良く似ていると思うかもしれません。今回はこの問題を解決するために、両方のデザインにおけるアプローチの違いに焦点を当ててご説明します。 マテリアルデザインにいたる歴史 二つのデザインスタイルについての長い議論を始める前に、それぞれのデザインが持っているルーツを見つけることは理に適っています。多くの人がマテリアルデザインはフラットデザインをベースにしていると信じています。 しかし、どのようにして我々はフラットにたどり着いたのでしょうか？ スキューモーフィズム UIとウェブデザイン用語でスキューモーフィズムは、現実世界にあるものを模倣するアプローチを指します。アップルのリアルな質感、明るさ、派手
エンジニアでも一読の価値あり！UI / UXの入門スライド厳選10点まとめ
Webサービス開発にしてもアプリ開発にしても、ユーザーに気持よく使ってもらうにはUI / UXを工夫する必要があります。 多くのユーザーに支持されている大規模WebサービスやアプリのUI / UXをよく見てみると、ユーザーにストレスがかからないよう細やかな工夫が施されていることがわかります。 エンジニアにとってもUI / UXに関心をもっておくことは重要です。 フロントエンドエンジニアはもちろん、バックエンドエンジニアもユーザーにより良い体験を届けるためにUI / UXを学ぶことをおすすめします。 今回は、エンジニアがUI / UXを基礎から学ぶ際に参考になるスライドを厳選して10個まとめました。
3分あれば十分！もうひと工夫加えるだけでレベルアップするデザインTips 25選 - Brian'z Imagination
はてなでブログを書き始めて2週間ほど経過したのだけれど、ブログを始めると書く内容そっちのけでやたらとデザインにこだわりたくなることがある。 特に、ホットエントリーを覗いてみると、内容はもちろんすばらしいものばかりだけれど、なかにはデザインが素晴らしいサイトもあって、魅了されることがある。 どんなふうにデザインしたのか、どういう思考回路になるとこんなデザインが思いつくのか、などなど。 デザインはデザイナーの既得権益・不可侵領域はなく、万人が自由に扱えるものだ。そして、デザインはセンスではなく理論(theory)だ、ということも以前書いた。 デザインを勉強すれば、ブログに手を加えたり、自分で名刺を作ったり、部屋をお洒落にコーディネートしてみたり、いろんなことができる。 ブログでいえば「Webデザイン」というジャンルから始めるのが定番ではあるのだけれど、これからデザインを始めるひとにはぜひ「グラ
国内でも注目されつつあるデザインツール「Sketch3」がよく分かる良記事15選
今、海外デザイナーを中心に広まっている「Sketch3」をご存知でしょうか。 国内では、Photoshopなどと比較するとまだまだ利用者が少なくマイナーなイメージがありますが、多数のUIデザイナーが活用している優秀なドローイングツールです。 今回は、Sketch3の使い方を分かりやすく紹介している記事をまとめてご紹介します。 Sketch3の魅力や他ツールと比較した記事もありますので、Sketch3が気になる、購入したけど使えていないという方はぜひご覧ください。 Sketch3の使い方が分かる解説記事まとめ 1.Sketch 3を使う3つの理由と10の魅力｜グッドパッチのUIデザイナーに聞く Sketch 3の使い方 http://ascii.jp/elem/000/001/023/1023681/ 国内トップレベルのUIデザイン集団グッドパッチのデザイナーが、Sketch3の魅力と使う理
新しいものが大好きなGoodpatchで1月に話題になったアプリ、サービス、デザインまとめ（2016） | Goodpatch Blog
みなさん、こんにちは！ UIデザイナーののがちゃん(@aekiikea)です。本館が増床し、キッチンができました！是非遊びにきてくださいね((^o^)) では今年一発目のメモパッチまとめです。どれもおすすめのサービスなので要チェックです！ 過去のまとめはこちらからどうぞ！ Kemail http://kemailapp.com/#/en Kemailはメールアドレスや住所を素早く貼り付けるためのカスタムキーボードです。アプリから複数の文字列を保存できます。名前や電話番号、ホームページのURLなどよく使うものを登録しておくと入力が便利になります。Goodpatchが日本語のローカライゼーションをお手伝いしました。 Peach http://peach.cool/ Peachは海外で人気上昇中のSNSアプリです。ホームのタイムラインでは友達の更新情報のみ表示され、メインは各個人のタイムラインと
奥行きを意識したプロダクト-iOS9で変わる体験-
2015-11-05 に開催された『iOS 9 週連続 Bootcamp!』の第６回目で Xcode 7 の新機能について紹介してきました。ざっくりとじっくり含めて、目に止まった新機能を網羅的に扱っています。
オブジェクト指向UX | POSTD
(注：2015/11/18、記事およびタイトルを一部修正いたしました。) CNN.com で働いていた2012年6月に、大統領選挙投票日の夜のユーザエクスペリエンス（以後UX）のデザインを任されました。私はそれからの6カ月間を投票日の夜のための仕事に専念しました。しかし、仕事が成功するかしないかは、選挙結果に関係はありませんでした。私が懸念していたのは、情報の見つけやすさやデータの見やすさ、canvasでのオブジェクトの変形、そして一体どのようにしたら、iPhoneでマウスオーバーのフライアウトが動作するのかでした。CNN.com史上初めてWebデザインをレスポンシブにすることにしたのです。さらに史上初めて私が、その デザイン を担当することになったのです。 大きな賭けでした。CNN.comにとって大統領選挙投票日の夜と言えば、スーパーボウル（プロアメリカンフットボールの優勝決定戦）の日曜
Yahoo!ニュースの編集者とエンジニアとデザイナーは何を考えているのか？（その2／ABテストの活用法） - メディア漂流記
Yahoo!ニュースが9月17日に開催した公開ディスカッションのイベント「real news "tech" HACK with エンジニアtype」。第1部では、エンジニアtypeの伊藤健吾編集長の司会のもと、Yahoo!ニュースの編集者（苅田伸宏さん）とエンジニア（庄司和正さん）が、巨大ニュースサイトの運営における「編集とテクノロジーの関係」を語った。 その前半では、スマホの普及とともに重要性が高まっている「プッシュ通知」について、Yahoo!ニュースの現状と課題が話された。レポート記事はこちら。 後半では、編集とテクノロジーが連携しながら問題解決にあたっている代表例として「A/Bテスト」があげられ、「人間にしかできないことをテクノロジーで加速する」というYahoo!ニュースの考え方が語られた。この記事では、その議論の概要を紹介する。 ■Yahoo!ニュースを裏で支える「A/Bテスト」
守ってはいけない、iOSのデザインルール4つ
ページコントロール（ドット）、ページトップの「送信」、プラス（＋）アイコン、並べ替えアイコンの4つは、テストでユーザビリティ上の問題を引き起こすことの多いiOSデザインパターンである。 4 iOS Rules to Break by Aurora Bedford, Raluca Budiu, Kara Pernice, and Amy Schade on July 9, 2015 日本語版2015年8月31日公開 巨大ソフトウェア会社（たとえば、AppleやMicrosoft、Google）はユーザーとデザイナー双方のためにデザインガイドラインを作成している。 おかげで、デザイナーや開発者側は、恵まれた条件のもとで、きちんとしたものになることが期待できるインタフェースの作成を始められるようになり、まったく新しいUI要素を考案する（そしてテストする）必要がない。 一方、ユーザー側も、すべての
簡単便利！サクッとモックアップが作れる便利ツール10選
この記事は2016年11月14日に更新しました。 客先でプレゼンする際に、イメージ画像を入れるだけでは魅力が伝わりにくいと感じるときはないでしょうか？ 例えば、アプリやWeb制作の場合なら、完成形に近いビジュアルを見てもらう方が見栄えがいいですし、イメージしやすくなります。 そんな時に活用したいのが、完成形に近いイメージ像を簡単に作成してくれるモックアップ作成ツールです。 今回は、オススメしたいモックアップ作成ツール10種をご紹介します。とにかく簡単に使うことができますので、お客様や社内のメンバーに完成イメージを伝える必要がある際は、活用してみましょう。 モックアップとは モックアップとは、本物に似せた模型のことです。 例えば、携帯ショップに行くとよく製品の大きさやデザインの確認をするためのプラスチック製の実際には使えない模型を見かけます。それがモックアップです。 一般的に、工業製品のプロ
Cookpad × Fablic のデザイナーイベント「Think User First」を開催しました。 - クックパッド開発者ブログ
こんにちは、ユーザーファースト推進室 デザイナーの吉井です。 クックパッドでは去る7月23日（木）、フリマアプリ「フリル」を運営するFablicさんと合同でデザイナー向けにイベントを行いました。 イベントのタイトルにもある通り、"ユーザーファースト"をテーマに掲げ、開発現場での実践事例を交えながら両社の文化やデザイナーの働き方についてご紹介しました。 お集まりいただいた70名の皆さまの熱量も高く、イベントスタート時からパネルディスカッション、懇親会に至るまで、とても充実した時間を過ごさせていただきました。 ご来場いただいた皆さま、本当にありがとうございました。 また今回は多数応募をいただいたため残念ながら抽選に漏れてしまった皆さま、たいへん申し訳ありません。 こういったイベントは今後も開催していきたいと思いますので、またのご参加を心よりお待ちしております！ 最後に、各発表者の当日のスライド
アップルとグーグルのガイドラインに学ぶスマホWebデザインの要点（スライド付） | ベイジの社長ブログ
スマートフォン対応させるWebサイトが急増しています。しかし、スクリーンが小さくタッチ操作がメインのスマートフォンでは、デスクトップ向けWebサイトのデザインで培ったノウハウの多くが通用しません。このような時代におけるスタンダードなデザインルールを学ぶために、弊社デザイナーの荒砂を中心に、Appleが公開しているiOS Human Interface Guidelineと、Googleが公開しているMaterial Design Guidelineの比較を行いました。（以降、両者をガイドラインと略します） スマートフォン向けのWebサイトのデザインを考える上で、アプリのUIデザインの定石を知ることは重要です。なぜなら、スマートフォンにおいてはWebサイトをブラウズする機会は14％しかなく（comScore調査／2014）、多くの時間をアプリの中で過ごしているためです。さらにユーザは「これは
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
エンジニアのためのスライドデザイン実践講座 / How to design presentations for engineers
新着記事
