React Sketch.appでデザインガイドラインを作ってみたリポジトリのURLはこちらです https://github.com/sawa-zen/style-guide
(デザイン初心者向け)メルカリのデザインチュートリアルを作ってみた(ホーム画面UI編)｜ココディー｜note
(*この記事はデザイン未経験者や、非実務経験者の方に向けた実践記事です。) ✏️目次(再掲) 0. 前置き 1. メルカリとは 2. UIトレースをしてみる 3. デザイン観点の追加と、トレースの調整 4. 実際にメルカリのデザイナーに聞いてみた 5. まとめ・終わりに 0.前置きこんばんは、ココディーです。 前回、こんな記事を書いて、デザイナーや、デザイナーに未経験からなったという人達から、たくさんの反響をもらいました。ありがとうございました！ この記事の中で、問題視していたのは「デザイナーの総数を増やしていく必要性」でした。 その上で「ノンデザイナーからデザイナーになっていくプロセスが確立していない」ということを課題として、その解決の一つの方向性として「デザイナーに弟子入りするということ」を挙げていました。 とはいえ、「未経験からデザイナーのもとに弟子入りをする」という事も、デザイナー
Atomic Designの概念を参考にSketchのシンボルを効率的に管理する方法 | UXデザイン会社Standardのブログ
We’re getting things ready Loading your experience… This won’t take long.
【Sketch】TwitterのUIをトレースしながら研究しよう！（初心者向け） - NOGA BLOG
UIデザイナーの、のがちゃんです！ デザインスキルを上げるには、良いデザインを真似ること。私が尊敬するデザイナーの先輩達は皆口を揃えてそう言います。 １日ひとつdribbbleなどからかっこいいロゴや名刺などを選んでトレースすると良い。 そのときに、なんで自分がかっこいいと思ったのかを考えること。 デザイナーになる秘訣！Time Ticketで、石嶋未来さんに会ってきた - NOGA BLOG UIデザイナーで、本当にスキルを身に着けたい人は、新規事業とかのキラキラした仕事を求めるのではなく、TwitterとFacebookアプリをSketch3で完コピして、何故このUIなのか背景を理解して、Prottで動かして触って、iOSのガイドラインを読み込むと早いと思うよ。 — Tomo Tsubota (@tsubotax) 2016年6月12日 とはいえ、これからUIを学ぼうという方には、どう
Sketchを使い倒すための便利プラグイン16選
ここ最近注目を集めているデザインツールといえば、Mac用ベクターグラフィックソフト「Sketch」です。 数年前までは日本ではほとんど知名度はありませんでしたが、Fireworksの開発終了後から徐々に注目が高まり、日本国内でも使用する人が増えています。 Adobe製品と比較すればまだまだ情報量不足のSketchですが、豊富なプラグイン、軽い使い心地などSketchならではの魅力もありデザイナーの間で話題となっているツールです。 今回は、デザイナーなら入れておきたいSketchのプラグインをまとめてご紹介します。 すでにSketchを使い始めている方はもちろん、興味を持っているという方もぜひ参考にしてみてください。 デザイン作業が捗るSketchプラグインまとめ 1.Sketch Palettes https://github.com/andrewfiorillo/sketch-palet
Sketchに入れたい、便利なプラグインまとめ
こんにちは。 前回はSketchの画像の書き出しについてご紹介しました。 ▷Sketch初心者が知っておきたい！画像のスライス機能について 今回はSketchをより快適に使うためのプラグインを、ご紹介したいと思います。Sketchのプラグインは色々あるのですが、中でも便利だなと思ったものをあげていきます。 （そもそも「Sketchとはなんぞや？」という方はこちらの記事をご参照ください。） Sketch Toolbox まずはじめに、プラグインではないのですが、プラグインをスムーズにダウンロードできるソフトを入れます。 Sketch Toolboxはそのソフトで、スムーズにプラグインを入れる事ができます。 プラグインを入れる方法 ソフトを立ちあげて、検索フォームに入れたいプラグインの名前を検索。 そのInstallのボタンを押すだけで完了です！ プラグインをアンインストールする方法 アンイン
Prottとsketchとzeplinのススメ
Skechのexport • 複数要素に対する一括スライス設定ができる • 背景（写真や図形など）を含めず、アイコンなど必要 な要素だけを背景透過でexportすることができる •iOSアプリに必要な等倍、2倍、3倍の3種類の サイズのassetsを一回でexportすることができ、 ファイル名の末尾に”@2x” , “@3x” を自動的 に付与してくれる
Photoshop、Illustrator、Sketch…デザインツールは結局どれがいいの？
Photoshop、Illustrator、Sketch…デザインツールは結局どれがいいの？みなさん、UIデザインのツールって何を使っていますか？かつてはWebデザインに使うグラフィックツールはPhotoshop一択でした。しかし昨今はお手頃価格のグラフィックツールが増えてきて、どれを使うのがいいのか悩んでしまったり…。私もその一人でした。そこで現在巷でよく使われているPhotoshop、Illustrator、Sketchを比較してみました。 UIデザインのツールって、何使ってます？ — Webクリエイター ボックス (@webcreatorbox) February 19, 2016 Twitter でもアンケートを取ってみました！やはり Photoshop 強し！ 各ツールとも日々進化しており、以前はできなかった機能ができるようになっていたり…と、今回記事を書いていて改めて気づいたも
try! Swift ライブデザイニング:🎙🎨 #tryswiftconf Day2-10 - niwatakoのはてなブログ
Maxim Cramer デザインと開発のバックブランドを持ち、人を観察し、技術が本当に役立つように改善することに情熱を持っています。 twitter.com 私たちはコードを書くことが好きです。しかし、App Storeで注目されるためにはコーディングだけでなく、他の素養も必要になります。この講演では、アプリの申請時に必要となるアプリアイコンとスクリーンショットをSketchを使って作成するデモをその場で行います。コーディングからアプリ申請まで、自分一人でうまくやる方法を説明します。 今日使うものはSketchを使います。とても今人気です。Adobeと比べて安価です。ベクターベースなのでIllustratorに近いです。でもWebデザイン、Appデザインに向いています。 最初、AppIconを作ります。iOSの新しいアイコンです。 良い例です。シェイプで出来上がっていて、簡単に作ることが
Sketch買ったばかりのプログラマがアイコンデザインに挑戦してみたメモ #tryswiftconf - その後のその後
「try! Swift」2日目のセッション "Live Design:🎙🎨" （日本語タイトル：ライブデザイニング）で、Sketchを使ってサクサクとアイコンをつくっていく過程を見て、 Sketch使いやすそう。買おう。 #tryswiftconf— Tsutsumi Shuichi (@shu223) 2016年3月3日 と思い *1、さっそくダウンロードして同じ手順をなぞってみることにしました。 Sketch - Professional Digital Design for Mac ちなみに購入する気満々だったのでこういうタイトルにしたものの、Free Trialで30日間は無料で使えるようです。 @niwatako さんの聞き起こし記事を参考に手順をなぞっていきます。 try! Swift ライブデザイニング:🎙🎨 #tryswiftconf Day2-10 - niwat
エンジニアのための「Sketch入門！」 1時間コース - Qiita
※「Sketch」はMac専用アプリです。Windows版はありません。 __「演習ファイル＋動画＋演習付き」__で記事を書いてます。 エンジニアの人から「Sketch使ってみたい」「日本語の記事が少ない」という声を聞いて、最近社内で勉強会しました。 Sketchについて日本語の記事を調べてみたところ、このレベルの記事はけっこうありました。 ただ、学びやすいか？といえばそうではないらしいので、少し工夫して学びやすいように書いてみました。 __ハンズオン用__などにご利用ください。 Sketchとは Sketchについて一応さらっと書いておきます。 ・アプリやWebのデザイン・UI設計などに使われるMac用アプリケーション IllustratorやFireworksのようなツールです。 ・$99 買いきり(2016/02 現在） 有料です。 ちなみにApp Storeでは買えなくなりました。
UIデザイナーはしっかり押さえておきたい、Sketch 3.5の新機能とデザインフローのまとめ
3ヵ月前にSketch 3.4がリリースされ、2016年1月26日に多くの改良とバグフィックスで新しいバージョンのSketch 3.5がリリースされました。 ※2016年2月3日現在の最新版は3.5のマイナーバージョンアップの3.5.1です。 3.5はパフォーマンスの改良だけでなく、機能的にも多くの改善がされており、今まで以上により快適なデザインフローとなるSketchの新機能を紹介します。 What's New in Sketch 3.5? 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 アートボードでのタイトル表記 「Retina Canvas」のチェックボックスは除去 キャンバスのちらつきを改善 グルーピング 常に選択されたレイヤーの上に挿入 角度を数値で回転 すべてのガイドを除去 使用しているフォントをすべて表示 アートボード
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sketchハンズオン超簡単4つのキーで覚えるはじめ方
Sketch Plugin Advent Calendar 2016 - Adventar
Sketch Advent Calendar 2016 - Adventar
デザイナーによるAtomic Designの実践〜導入編・運用編〜
GitHub - ment-mx/Prism: Creates a beautiful artboard color palette with all your 'Document Colors' and their respective color label in a variety of formats.
物理サーバを選定する際のポイント – Eureka Engineering – Medium
IllustratorとSketch対応のiOS 9.3のUI Kit:phpspot開発日誌
[Sketch, Photoshop] Craft - ダミーデータ入力に便利なSketch, Photoshop用プラグイン