Material DesignBuild beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
Bootstrapのグリッドシステムのガイドラインをデザインツールで表示する ｜ Tips Note by TAM
こんにちは。 僕はデザインとフロントエンドを兼ねて仕事をしているのですが、デザイン段階でCSSフレームワークのガイドラインを意識してデザインすると、コーディングが格段にスピードアップするのを実感しています。 本記事は今までグリッドシステムを使ってデザインをしたことがないという方を対象に、Bootstrapのグリッドシステムを例にして、ガイドラインの考え方とデザインツールでのガイドラインの引き方をご説明します。 Bootstrapのグリッドシステムのガイドラインとは? Bootstrap CSSフレームワークの代表。作業を効率化できるCSSがあらかじめ組み込まれた枠組みです。 http://getbootstrap.com/ グリッドシステム Bootstrapでは12本の縦のガイドラインが存在し、そのガイドラインの幅に沿ったコンテンツを実装することができます。 Bootstrapのグリッド
一般的なアイデアシート
Idea Sketch Sheet – Basic は、一般的なアイデアスケッチシートです。 方眼やドットの配置が違う７種類のシートが入っているので、お好みのPDFを印刷してご使用ください。 半分に折り畳んでA5サイズとしても使えるように、ヘッダーには TITLE、PLACE、DATE がそれぞれ２つずつ配置してあります。 basic_grid00_cross00.pdf basic_grid10_cross00.pdf basic_grid10_cross50.pdf basic_grid10_cross70.pdf basic_grid20_cross40.pdf basic_grid25_cross50.pdf basic_grid35_cross70.pdf 3flab-basic_grid00_cross00.pdfドット: 5 mm 3flab-basic_grid10_cro
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ページを開く
エンジニアのためのSketch入門 (全30回) - プログラミングならドットインストール
