ウェブデザインに関する記事一覧

ホーム
ウェブデザイン

ウェブデザイン

2020.03.1

写真を「モノクロ＋一部カラー」にして画像にメッセージ性をもたせる方法

モノクロ写真の一部だけに色付けされていると、どことなくメッセージ性を強く感じると思います。例えば、次の2枚の写真はもともと同じ写真ですが、僕の場合、左の写真…
2019.02.16

inkscapeで「フチ文字」を作る方法２つ＋ちょっとした応用

以前、問い合わせがあったinkscapeで「フチ文字」を作る方法を紹介します。文字の周りを縁取るので「フチ文字」と言われています。「囲み文字」とは意味が違う…
2017.10.6

Inkscapeのシェイプとパス編集でいろんな「吹き出し」を作ってみた

多角形や星型をノードツールで変形させることでいろいろな吹き出しを作ることができます。ちょっとしたデザインのアクセントとしても使える吹き出しを自作してみましょ…
2017.10.3

Inkscapeで配色用のカラーパレットを簡単に作る方法

配色用のカラーパレットをInkscapeの内部機能で作る方法を紹介します。基本的にはカラーホイールの考え方で、明度や彩度をコントロールする方法なのですが、知…
2017.05.7

inkscapeで立体的な文字の作り方（テキストと押し出しの組み合わせ技）

飛び出てくるようなテキストのロゴを作る方法をまとめてみました。今回紹介するのは単にベベルで浮き上がらせるだけではなく、すどーん！とインパクトのあるテキストロ…
2017.04.16

Inkscapeを使ったわかりやすいフローチャートの作り方

プログラミングの分野でよく使われているフローチャートですが、最近は業務フローなどの手順書やマニュアル作成にも利用されてきていますね。というわけで、今回は見や…
2017.02.28

WordPressでも簡単に使えるってほんと？会話風吹き出しのCSSテンプレート

会話風吹き出しのテンプレートとして使えるCSSを作ってみました。会話風吹き出しのデザインは一見難しそうに見えるのですが、要点さえ抑えてしまえば誰でも簡単に作…
2017.01.8

簡単にテキストレイアウトができるinkscapeの「テキストの流し込み」機能の使い方

写真付きのパンフレットでよくあるテキストレイアウトには被写体を邪魔しないようなテキストの配置がされていますね。テキスト部分の輪郭がカーブしてることが特徴的で…
2016.12.31

自作？外注？その前にコレ！ブログのロゴデザインをするなら「Logaster」を使ってみて

ブログやサイトのロゴを作るときって時間的・金銭的に結構なコストがかかりますよね。見栄えが良いロゴを作るにはある程度のデザインスキルを必要としますし、プロに依…
2016.12.31

混乱してない？CSSレイアウト【position: absolute】を最短で理解するための2つのポ…

positionを使うとfloatやmarginを駆使してレイアウトを設定するより簡単に設定できてしまうのですが、1つ難しいところがありますね。そう。…
2016.12.3

プラグイン不要！2ステップで完了！「FontAwesome」をWordPressに導入してアイコンを…

ブログのカスタマイズをするとき、必要なアイコンをいちいち画像化して、フォルダにアップロードするのは手間ですね。そんなときは「Font Awesome」という…
2016.11.11

AdSenseのモバイル向けページ単位の広告をWordPressに設置する方法

AdSenseにモバイル用のページ単位の広告という機能が追加されてしばらく経ちましたが、導入しているブログをあまり見かけないですね。↓こういうやつです。…
2016.11.11

子テーマを使ってWordPressを自由にカスタマイズしちゃいましょう

WordPressをカスタマイズするときに使うと便利なのが「子テーマ」です。子テーマとはベースとなるテーマのCSSやPHPファイルを引き継いで、部分的にカス…
2016.10.30

inkscapeで取り込んだJPGやPNG画像をトリミングをする方法

inkscapeでフライヤーや店舗のメニューを作りたいと思ったらトリミング機能は欠かせない機能ですね。ただ四角形に切り取ったりすることもトリミングですが、メ…
2016.10.26

inkscapeの基本機能だけで矢印を描く方法

今回はよく検索されている、inkscapeで矢印を作るための基本チュートリアルを紹介します。GIMPのようにエクステンションを使わなくても基本機能だけで矢印…
2016.10.16

「とあるのロゴジェネレーター」を参考にinkscapeでロゴをリメイク

「ロゴ作成の勉強ってどうやってすればいのー？」と、よく自分でも考えているのですが、やっぱり誰かが作ったロゴをまねして作るのが一番いい気がします。すでに完…
2016.10.15

inkscapeのタイルクローンでマスキングテープを張り合わせたパターンを作るチュートリアル

パステルカラーのマスキングテープを張り合わせたようなパターンを作成したときの方法を紹介します。ノードをギザギザにするランダムに色を変える大…
2016.09.28

inkscapeを使って集中線・放射線を思い通りの仕上がりに

グラフィックソフトの場合、手で描くのとは違って、機能とその結果が結びつかないことがよくあります。今回紹介する「集中線」もその1つかと思うのですが、実は簡単に…
2016.09.22

アイコンの基本は抽象化！特徴を見つけて基本図形に落としこむ方法

作りたいアイコンやロゴがあるときに、なかなかアイデアが浮かばないということもあるかと思います。そういうときはアイコンやロゴにしたい対象物をよく観察して、特徴…
2016.09.4

WordPressの子テーマを作るときのひな型テンプレートがあるんですが…

WordPressのカスタムをするときは子テーマを使った方が効率的で、もとのテーマを傷つけることもないです。子テーマ自体は簡単な構造なのでその都度、調べて作…