Profile twitter Facebook website spicagraph(スピカグラフ)角田綾佳 大阪枚方でweb・DTPデザイン制作をしているフリーランスです。イラストや参考にしたサイトのご紹介、アプリケーションの技術向上を目指すブログです。ツッコミ・アドバイスお待ちしてます!
![デザイナーのイラストノート - イラストや参考にしたサイトのご紹介、アプリケーションの技術向上を目指すブログです。](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
Get the latest insights UXやデザインのトピックからグローバルレポートまで、最新の情報をお届けします
2009年、JavaScriptの会社として株式会社ピクセルグリッドを設立。 多数のWebリニューアル、新規立ち上げを取り仕切った経験を持ち、情報設計、フロントエンド、クラウド活用、開発フローの効率化を得意とする。 Webをより発展させるため、新しくブラウザに実装された機能の活用事例を数多く生み出しつつ、日々、クラウドサービスを利用した効率のよい制作・開発手法の試行錯誤を続けている。現在の興味はWeb Componentsを使ったマークアップの改善とJamstack。 著書に『WebクリエイティブのためのDOM Scripting』(単著:毎日コミュニケーションズ、2007年)など。ここ数年は書籍の執筆をせず、フロントエンド技術情報メディア「CodeGrid」で精力的に執筆活動を行っている。
Robは、新進気鋭の映画プロデューサーであり、著名な作家、ポッドキャスター兼詩人です。またごく最近では、ArbentingとDead Wings Designsにおいてクリエイティブデザインとブログ制作デュオの共同創設者兼想像力豊かな共同寄稿者として知られています。 404エラーページはあらゆるWebデザインにおいて最も軽視されがちな項目の1つです。 そうでない場合は、ユーザーの苛立ちを少しでもユーモアで軽減しようと、遊び心のある仕組みやデザインを施す傾向があります。 多くのデザイナーは、自分たちのサイトはきちんと作ってあるので404など必要ないと思い、簡素な404エラーページを用意します。一方で、一部のデザイナーは冗談を交えたり、404エラーページをちょっとした実験の場として活用しています。 もし、そのページにユーモアが必要ならあっても問題ありませんが、遊び心と機能は完全に相互排他的な関
デザイン制作のなかでも、正しい色の組み合わせを見つける作業は、もっとも重要な過程のひとつで、デザインのたびに頭を悩ますデザイナーも多いでしょう。 今回は、手軽に配色を決めることができるチートシート「The Ultimate Color Combinations Cheat Sheet」が公開されていたのでご紹介します。 詳細は以下から。 コンプリメンタリー配色 Complementary Combination コンプリメンタリー配色は、カラーホイールの反対側の色を組み合わせた組み合わせで、補色(英: Complement)同士を組み合わせた配色を指します。この配色は、鮮やかで精力のある元気なデザインが特長です。 トライアド配色 Triads Combination トライアド配色は、カラーホイール上の等しい距離にある3色の組み合わせを指します。うまく調和の取りつつ、強いコントラストを表現
変化の早いWeb業界では、デザインのトレンドも常に移り変わっています。 Webデザイナーは、常に最新の情報に触れ、新しいトレンドにアンテナを張っていたいものです。その理由はただ一つ、そうしなければ時代に取り残されてしまうからに他なりません。 そのため、新人Webデザイナーはもちろん、長年デザイナーの職務についている方も、日頃から情報収集するクセをつけることが重要となります。 そこで今回は、Webデザイナーなら必ず押さえたい "情報サイト" をまとめてご紹介します。 Webデザインに関わる最新ニュースがチェックできるサイトから、ハウツー系の情報が満載のものまで、様々なものを揃えました。Webデザインのトレンドをいち早く手に入れるためにも、ぜひ一度チェックしてみてはいかがでしょうか。 Webデザイナーがチェックすべき情報サイト20個まとめ 1.Photoshop VIP http://phot
Photo by dalcrose こんにちは、谷口です。 プログラミング学習に関するサービスを運営していますが、最近は現役のITエンジニアやWebデザイナーといった職種に限らず、「HTML/CSSを勉強したい!」という人が増えてきたなと感じます。 ただ、初心者にとって一番の悩みは「どうやってHTML/CSSを勉強していくか」ではないでしょうか。 また、一口にHTML/CSSを学びたいと言っても 未経験から勉強を始めてWebデザイナーになりたい 独学で勉強しているが、周囲に質問できる人がいなくてつまずいた時に解決できない 仕事でエンジニアやデザイナーと話すときにHTML/CSSのことがわからなくて困ったので基礎的なことだけでも知っておきたい そもそもどうやって勉強を始めたらいいのか・どんな勉強法があるのかがわからない などなど、その人によって求めるレベル感は様々ですし、学び方もその人の目的
WordPressではSEO対策をプラグインを使うことで簡単に設定することができます。 Googleなどの検査エンジンの最適化するSEO対策のサポートをしてくれる有名なプラグインとして、「All in One SEO Pack」や「Yoast SEO」があります。 今回は、「All in One SEO Pack」でSEOの基本的な設定やSNSのOGP設定、XMLサイトマップの設定方法と投稿・固定の各ページの使い方を紹介していきます。 WordPressプラグイン:All in One SEO Packをインストール プラグインのインストール方法は下記の2種類あります。 以下URLよりダウンロードしてサーバにファイルをアップロード。 https://ja.wordpress.org/plugins/all-in-one-seo-pack/ WordPressにログインしてから【プラグイン】
インターネットの技術の進歩に伴い、誰もが簡単にホームページを作成できるようになりました。 しかし、いくら技術的な知識をつけても、「なにかダサい……」「なにか物足りない……」と感じることはありませんか? このような場合、多くは「デザインの基礎」を押さえられていないだけかもしれません。 今回は、デザインの知識が全くない「ノンデザイナー」の方でも、最低限押さえておきたい4つのポイントをご紹介します。いきなりプロ顔負けのデザインが作れなくとも、これさえ押さえておけば見ている人にも自分の意図をしっかりと伝えることができるでしょう。 1.テーマカラーを厳選する 「なにかダサい……」と感じるWebデザインは、配色のチョイスを間違えている可能性があります。 デザイナーは、何となくこの色が好きだから、という理由で配色を決めることはありません。 Webサイトには、伝えたいメッセージがあります。 例えば、男性向
近年、急速にスマートフォンの普及が進む中、PC版とは異なるUI・UXで、スマートフォン用に制作されたWebサイトが増えています。 これまでは「PC」が主体で制作されていたWebサイトですが、若い世代では"PCを所有していない人"も多く、スマートフォンだけで携帯電話とPC、双方を兼ねて使っているという人も少なくありません。 そのため、スマートフォンサイト(以下、スマホサイト)のUI・UXに関しても、より使いやすさというのが求められる時代になってきていて、必要とされるポイントとしては、画面が小さいため、視認性や可読性の高さ、タップのしやすさなどになります。 そこでユーザをストレスなく、目的とするページに遷移させるためにも重要となってくるのがグローバルナビゲーション(グローバルメニュー)の役割です。 今回は、実例をもとに、様々なスマホサイトのグローバルメニューをご紹介します。 各グローバルメニュ
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 デザインはユーザーのエンゲージメントを高める上で、最も重要なものの一つです。ユーザーはシンプルなインターフェースを好むようになってきたので、UIを基本的で必要最低限な要素のみに残していくことが成功の鍵です。 ミニマリズムは、構造と機能の絶妙な組み合わせから成り立ちます。その最大の強味は、構造を明確化することにあります。線を整え、たっぷりと余白を残し、そして視覚的な要素を最小にすることで、最も複雑な主題(内容)でさえもシンプルになります(もちろん、効果的に使われればの話です)。 ミニマルデザインでは、簡潔さ、明確さ、そして一貫性が求められます。明確なビジュアルコミュニケーションによってユーザーの問題解決を導くべきです。ミニマルなデザインのアプリが評価されるのは、ユ
「シリコンバレーはすでに地域の名前ではなく、マインドセットである」これはシリコンバレーの著名VCであるAndreessen HorowitzのMarc Andreessenによるもの。今までに無い新しいアイディアを元に同じ情熱をもった仲間を集め,プロダクトを作成し、その夢に賭ける。 最近ではこの考えは、この地域以外にも世界中に広がり、”シリコンバレー的な考え方”として認知されている。 参考: シリコンバレーはただの場所ではなく、マインド(とコミュニティ)である We are all designersこれに近い考え方がここ数年でデザイナーにも広がっていると思う。我がビートラックスのコアバリューの一つに”We are all designers“がある。これは文字通り、”我々は皆デザイナーである“の意味。
「サイトを作らない」という選択肢 Publish2016/10/19(水) Update2021/02/13(土) 今年になってからPTAのことばかり書いている気がする出口ですこんにちは。 今日もPTA絡みのことになりますが、先日リニューアルした高槻市PTA協議会のサイトをのことを書こうかと思います。 最初は作って欲しいと依頼されていた。 まず最初に、「高槻市PTA協議会のサイトを変えたい」という話を聞いたのは今年の5月頃のことでした。 その時には、正式に仕事としてお願いしたいということを伝えられたんですが、僕はその話を聞いてちょっと考えました。 というのも、この話を仕事としてそのまま受けてもいいけど、自分がもし受けてしまったらこれから先が大変になるんじゃないかなと。 作るより先に、まず今後のことを考えた まず、そんなことを思った理由ですが、はっきり言えば僕が作る方が圧倒的に楽なんですよね
2016年10月19日 Webサイト制作 プロジェクトを始動させるため、顔合わせのために行う最初のミーティングを、サッカーの試合開始の合図のキックオフにかけて「キックオフミーティング」と呼びます。キックオフミーティングはプロジェクトの目的を明確にしたり、クライアントと制作チームの親睦を深めたりと、今後業務を進めるにあたって欠かすことのできない重要なミーティングです。今回はそんなキックオフミーティングの必要性や効果的な進め方などをご紹介します。 ↑私が10年以上利用している会計ソフト! キックオフミーティングの目的 そもそもなんのためのキックオフミーティングなのか?ここをきちんと理解しておかないと、結局なぜ集まったのかわからなくなってしまいます。まず覚えておきたいのは、クライアント自身もWebサイトを通じて何を発信したいのか、漠然としか把握できていないという点です。キックオフミーティングでは
段階的に考えるデザインのアドバイス 時々「デザインのアドバイスもらえますか?」という依頼を受けることがあるわけですが、応えるのに困ることがあります。尋ねている側は「もっと良い見た目、さらに使いやすくするにはどうしたら良いか?」というニュアンスを含めて質問しているわけですが、初めて見る成果物に対して評価するのは極めて困難です。 成果物は突然生まれるものではありません。価値共有を行ったり、あえて省いた機能や、意図的に作られた表現もあります。こうした過程を経て Web サイトやアプリという成果物があるわけですから、それらを理解する前に評価するとなると、どうしても「好き」「嫌い」といったリアクションに近いものになりがちです。「これはどうですか?」と尋ねても、的外れなフィードバックが来る場合があるのはそのためです。 ムードボードを作るとき、自社ブランドを言語化・視覚化する際、「好き」「嫌い」という感
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く