PhotoshopからXD、さらにSketchへ…Atomic Designを実現させるまでにぶち当たったデザインチームの苦悩 | スペースマーケットブログ
PhotoshopからXD、さらにSketchへ…Atomic Designを実現させるまでにぶち当たったデザインチームの苦悩 デザイナーの横井です。こんにちは！ 猫飼いなのですが猫に顔をうずめるのが難しい季節になってまいりました（毛まみれ） 久しぶりのデザイン記事となりましたが、今日は弊社デザインチームが行ったAtomic Designのシステム化の紹介と失敗体験、そしてその道のりを、赤裸々にご紹介しちゃいたいと思います。 既に完成したデザインのコンポーネント化に悩んでいる方々の参考に、少しでもなれば幸いです。 初期のスペースマーケットデザイン ゴリゴリのPhotoshopデザインだった時代 弊社のメインサービスである、スペースマーケットのデザインは約3年前にリニューアルリリースされました。 当時は全てPhotoshopでデザインされ、１ページにつき１ファイル、スマートフォンもPCも別フ
デザインの保守性を上げるにはどうしたら良い？AtomicDesignでUIデザインをしてみた - Qiita
TL;DR デザインの保守性をあげるためにsketchでAtomicDesignを導入してみました。 パーツ数が少なくなり、構成もシンプルになったのでだいぶ保守性が上がったのですが、 sketchファイルが重くて台無しなのでどなたか軽くする方法あったら教えてください。 はじめに 株式会社マナボでSketchを使って『manabo』という中高生向け質問アプリのデザインリニューアルを進めているのですが、 Sketchは画面やSymbol(パーツ)が増えてくると管理が非常に大変になりますよね。 ちょっとした色やマージンの修正に対しても複数の画面やSymbolを修正しなければならず、 余計な作業工数や修正漏れが発生してしまいます。 そんな状況を打開すべく、SketchにAtomicDesignを導入して保守性の高いデザイン設計にトライしてみたので書きます。 AtomicDesignとは Atomi
【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 App Sources - New Free Design Resources - Icons, UI/UX Kits, Wireframes, iOS, Android Templates for Sketch
Thousands of UI/UX resources from great and resourceful designers around the world Sharing and building on each other's work is the ultimate form of learning and retaining knowledge. Since 2012, we're curating some of the best resources to help you design, prototype, and collaborate better and faster. UI Kits Apps Icons Illustrations Wireframes Ideas Web iOS Material Data Forms Mockups Real Annota
Saving time in Sketch
With Sketch 3, Bohemian Coding has finally offered interface designers a great design tool with the speed and flexibility that competitors lack. I’m a freelance interaction designer and I have been using Sketch since the early days. I have successfully introduced Sketch into my design workflow and I’m willing to share my insights with you. Here are 6 time saving design techniques that I have gathe
Sketch.appで描かれたDribbble投稿作品まとめ10こ | Goodpatch Blog
最近のMEMOPATCHではSketch.appについての記事を続けてアップしているのでSketchに興味を持たれている方もいるのではないでしょうか？ 前回記事: 「Fireworksユーザーに朗報？海外で話題の新しいWeb制作ツールSketch.app」 前々回記事: 「Sketchを買ったら読んでおきたい！基本的なことからちょっとした小技、ショートカットまとめ」 Sketchをダウンロードして気になるのが、どんなものを作れるかではないでしょうか。Sketchはまだ新しいアプリですがいくつかのクオリティの高い作品がDribbbleなどのデザイン投稿サイトにあがっています。そこで今回はSketchで描かれたアイコンをご紹介します！ （各リンクはDribbbleの作品ページに飛びます） Mailbox client [.sketch] https://dribbble.com/shots/1
Sketchを買ったら読んでおきたい！基本的なことからちょっとした小技、ショートカットまとめ | Goodpatch Blog
つい最近までSketchは日本であまり知られておらず、日本語でSketchについて書いている記事はほとんどありませんでした。ところが5月7日にFireworksの開発終了が発表され、代替ツールとしてSketchの名前が急浮上。それに合わせたのかSketchが5月8日に半額セールを行い、Sketchについて書かれた記事やツイートも増えてきて、注目度の高まりが感じられます。とはいえ英語日本語問わず、Adobe製品に比べたら圧倒的に情報量が少ないSketch。Adobe製品と同じような機能やショートカットも多いですが、使いこなせるようになるまでは少し時間が掛かりそうです。Goodpatchでもマニュアルや記事を読みながら、隙間時間にSketchを触ってその機能を確かめています。というわけで今回は、Sketchの基本的な機能や、発見した小技、ショートカットなどをまとめてみました。 先日アップした「
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://creative-tweet.net/blog/2014/04/sketch-3-is-new-available.html
http://www.sketchgems.com/
https://creative-tweet.net/blog/2013/05/translate-sketchapp.html