Profile

Cover photo
creativeweb.jp
1 follower|14,897 views
AboutPostsPhotosVideos

Stream

creativeweb.jp

Shared publicly  - 
 
漫画更新しました!→「Tumblrでポートフォリオを作ろう(indexトップページ,パーマリンク記事ページの振り分ける)(3)| マンガでなれる?WEBデザイナー講座 」
https://creativeweb.jp/manga/tumblr/page3/
 ·  Translate
今回のようなサンプルのポートフォリオ(シングルページ) http://portfolio.designlabo-mika.com/の場合はindex用とパーマリンク用でメニューのリンク内容を変えています。 トップページではメニューのリンクを押すと各コンテンツの位置へ移動するようにしてあります。 1.トップページのリンク ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
漫画更新しました!→ 「Bootstrap実践編 スケルトンサイトから制作するWeb制作短縮方法(1) | マンガでなれる?WEBデザイナー講座 」
https://creativeweb.jp/manga/bootstrap-2/page1/
 ·  Translate
前回のBootstrap編では基本的なWebコンポーネントとSass導入方法を説明しました。 今回は実践的なBootstrapサイトを効率よく制作するための手順としてスケルトンサイトからWebデザイン制作する方法を紹介したいと思います。 yoko. えーと、スケルトンサイトってなんですかぁ? mika. 正しい言い方は人や会社によって ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座を更新しました。グラフィック編「第2話 軽快なベクターソフトSketch3の紹介」です。https://creativeweb.jp/manga/graphics/page2/
 ·  Translate
IllustratorよりSketchの良い所. Adobeソフトより起動が速い!操作も快適。 操作が単純なので短期間で習得が可能。 ベクターソフトなのでフラット感のあるデザインが作れるのでレスポンシブスマートフォンサイトの時代にあっている。 Illustratorと違ってWEBやアプリデザイン制作向けに作られたソフトで扱える単位が ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座を更新しました。「Bootstrap初心者でもできる!サイトの色を変える方法(番外編3)」です。
https://creativeweb.jp/manga/special/page3/
 ·  Translate
Bootstrap初心者でもできる!サイトの色を変える方法(番外編3). mika. 今回はPaintStrapで簡単にBootstrapテーマを作る方法を紹介します! PaintStrapを使うにはAdobe Colorか COLOURloversであらかじめカラーパターンを作る必要があります。 今回はAdobe Colorから作成する方法を説明します。
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座、Bootstrap 編を更新しました!「第3話 Bootstrap SassをGUIコンパイラで手軽にカスタマイズ!」です。
https://creativeweb.jp/manga/bootstrap/page3/
 ·  Translate
BootstrapのWebサイトでカスタマイズから設定を変更してダウンロードする. 2.BootstrapのCSSを別のオリジナルCSSで上書きをする. 3.LESS/Sassファイルを直接変更、オリジナルスタイルを追加する. yoko. へぇ〜、いくつかカスタマイズ方法があるんですね。 mika. Bootstrap初心者の人は1か2が簡単なのでおすすめします。
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座、Bootstrap 編を更新しました!「第2話 Bootstrapで骨組みのHTMLを作ろう!」です。
 ·  Translate
私はコーディングの時には「Brackets」(無料オープンソースコードエディター)のソフトを使用しています。 (慣れているエディタソフトで編集してください。) 「stylesheets」ファイルの中に「style.scss」という名前でファイル作成します。 これがBootstrapのCSSを上書きできるSCSSになります。
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
漫画更新しました!→ 「Bootstrap実践編 基本的な書式、タイポグラフィー、サイトカラーを作成する(2) | マンガでなれる?WEBデザイナー講座 」
https://creativeweb.jp/manga/bootstrap-2/page2/
 ·  Translate
骨組みのスケルトンサイトが完成した後はデザインをIllustratorやPhotoshopなどで作成します。 今回はUIが作りやすいSketch3を使用してデザインをします。 下記のBootstrapテンプレート(Illustrator・Sketch対応)をダウンロードしてデザインのベースとして使います。 Webデザインに使うツール ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
漫画公開しました。グラフィックス編「第3話 Sketch3でSVGアイコンを作ってみよう!」 
https://creativeweb.jp/manga/graphics/page3/
 ·  Translate
2.Mac iconの512pxを選ぶ(大きさは任意です). 2.Mac iconの512pxを選ぶ(大きさは任意です). mika. アートボードの名前を任意で変更することが可能です。エクスポートで書き出し時の画像の名前になります。 Webで使用する場合は半角英数字にしましょう。
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座を更新しました。グラフィック編「情報を視覚化するインフォグラフィックスを学ぼう」です。
https://creativeweb.jp/manga/graphics/page1/
 ·  Translate
インフォグラフィックスについて. インフォグラフィック(英語: infographics)は、情報、データ、知識を視覚的に表現したものである。インフォグラフィックは情報を素早く簡単に表現したい場面で用いられ、標識、地図、報道、技術文書、教育などの形で使われている。また、計算機科学や数学、統計学においても、概念的 ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座、番外編を更新しました。「簡単にポートフォリオサイトが作れる無料Webサービスの紹介(番外編2)」です。
https://creativeweb.jp/manga/special/page2/
 ·  Translate
今は時間をかけずに簡単に無料でサイトを作ることが可能よ。 だからボンヤリ考えている暇があったら細かいデザインは気にせずに 1日でも速くWebサイトを作った方がGoogle検索にも有利なの。 私のポートフォリオ制作期間はWordPressで大体1週間程度でサイトのベース(HTML/CSS)をBootstrapやAdobe Edge Reflowで制作し ...
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座、「Bracketsでコーディングのスピードアップ(番外編1)」を追加しました。
http://creativeweb.jp/manga/special/page1/
 ·  Translate
Brackets CSS Class Code hint. 編集中のHTMLのCSSのセレクターに書かれているclassとIDが、属性値の記述時にコードヒントを出してくれる。 (Bootstrap等CSSフレームワークで使うとスピードアップに効果アリ). Adobe Edge Inspect. スマホ実機での表示確認ができる「Adobe Edge Inspect」がBracketsで使用できる。
1
Add a comment...

creativeweb.jp

Shared publicly  - 
 
マンガでなれる?WEBデザイナー講座、5話目を更新しました!「Illustratorのデザインカンプから画像を書き出す方法」です。
http://creativeweb.jp/manga/webdesigner/page5/
 ·  Translate
Illustratorには「Web用に保存」、「スライス範囲で書き出し」など、さまざまな書き出し方法があります。 Web制作では複数のデザインパーツを書き出す事が想定されるので「アートボードごとに書き出す」方法が使いやすいためご紹介します。 ただしIllustratorはアートボードから書き出す方法では以下の不満があります。
1
Add a comment...