投稿者: 森島

マークアップ

「HTMLって何?WEBサイトを作るってどうするの?」という方に、私たちがどんなことをしているのか知ってもらいたい。

仕事柄、WEBに関することをプライベートでも聞かれることが多いです。 一番多いのが「WEBサイトってどうやって作るの!?」というものなのですが、説明する際にHTMLソースを見せて「ここに画像を表示して、ここに文章を書いて、って表示の指示を延々と書いていくの」と伝えると、大抵の方が「そっか…」と少し悲しそうな顔をします。 英数記号の羅列を見ると拒否反応を示してしまう方が多く、そこで話が終わってしまいます。 実際にHTMLタグを学ぼうとして他のサイトを見てみるも、何だか難しそうだ […]

Webデザイン

デザイン公募まとめ

御存知でしょうか。今2016年度の年賀状デザインコンペ真っ盛りの時期だと言うこと。 とても気の早い話に思えますが毎年この時期です。早い所は皆が年始の休みが明けた頃に締切で、もう応募が終了していたりします。 aiデータを渡すので、デザイナーとしては割に合わない作業になりがちなんですが、ちょっとお小遣い稼ぎしたい時なんかにはぜひどうぞ。大体入賞すればそのまま商品化されます。 ◆2016年版 東急ハンズオリジナル年賀状デザインコンペ 締切:2015年05月18日 (月) 賞:大賞( […]

Webデザイン

【デザインの意味】都道府県の標章

こちら、日本の都道府県の標章です。先日まとめとして拝見したものなのですが、それぞれの意味を調べてみたらなかなか良い者になったので、記事にしてみました。 北海道 北海道開拓使が使用していた旗のデザインを元に、現代的にしたもの。先人の開拓者精神と雄々しく伸びる北海道の未来を表している。 —– 青森県 青森の地形を図案化したもの。カラーは深緑が指定してあり、余白の白地と合わせて意味が設定されている。白地は無限に広がる宇宙世界を表し、緑は躍進発展してやまない希 […]

Webデザイン

【デザインまとめ】綺麗なデザインの管理画面 30選

以前記事にした「【デザインまとめ】綺麗なデザインの管理画面 40種類 」、時間が経ってリンク先が消えていたりしますね。 また綺麗なデザインの管理画面も追加したいと思います。 サムネイルだけで見ると、全部似たようなものに見えてきますが、デモサイトを見てみると細かな部分でデザイナーさんの個性が出ていて面白いです。 ご参考になれば幸いです。 左に紺か黒のナビがあるやつ ◆Material Admin デモサイト ◆Edumix 黄緑がきれい デモサイト ◆Make デモサイト ◆C […]

Webデザイン

Twitterまんが Part35

おはようございます。今日の渋谷は晴れ。気温も12度らしくて随分春めいてまいりました。 私はというもの、最近「Sonomy」というアプリにハマっています。イベントの情報や美味しいご飯やさんの情報等が延々と流れてくるのですが、それらを「興味がある or ない」に分けることによってだんだんと自分好みの情報ばかり流れるようになるという画期的なアプリです。 今や私のSonomyはスイーツとごはんの情報ばかり流れてくるようになりました。位置情報とも連動していてピンポイントで情報を提供して […]

Webデザイン

【ロゴデザイン】日本語のロゴをたくさん集めました。

おはようございます。本日の渋谷は雨です。寒いですね。 風邪が流行っているようなので、温かい物を食べて、気をつけて過ごしましょうね。 今日は日本語のロゴを集めてみました。 英字のロゴはたくさんあるんですが、日本語のロゴっていざ探すとなかなかしっくりくるものが無くて苦戦したりします。 参考になれば幸いです。

Webデザイン

【Illustrator】初心者のためのパス練習帳

デザイナーとしてお仕事をしていると、デザインを教えて欲しいと言われることがあります。 私は専門学校でデザインを学んだのですが、一番初めに基礎として練習したのが「パスの使い方」でした。 デザインの作業をするにあたって、背景の柄や、絵を描いたり、ロゴマークを作ったり、非常に大切です。使えないと仕事になりません。 (私に話を聞きに来る学生さん達は、photoshopを使って絵を描くことはできるけど、パスを使えないという子が多かったりします。) デザインに関して話し始めると24hあっ […]

マークアップ

【怖くないJavaScript + jQuery】時間で切り替わるスライドショー

毎度おなじみ、[怖くないJavaScript + jQuery]シリーズです。 今回は時間で画像が切り替わるスライドショーを作りました。動作は一番シンプルで、クリックの処理は入っていません。TOPページでイメージ画だけ切替表示したい時に便利ですね。 合言葉は「jQuery こわくない」です。 デモのファイルはこちらからダウンロードできます。 デモ ▼サンプルでは、3枚のスライドがフェードのアニメーションで切り替わります。 別ウィンドウで開く Step1:まず下準備 こちらはい […]

Webデザイン

Twitterまんが Part34

おはようございます。今年もあと数日ですが、皆様いかがお過ごしでしょうか。 長い長い休みをとって、既に退屈に過ごしている方もいらっしゃるんでしょうか。 そんな退屈に少しお付き合いするために、今日も漫画を書きました。 ほっこりとした気持ちになれば幸いです。 流行りの 今回書かせて頂いたツイート 今日はこちらのツイートを書かせて頂きました。 2014年大流行した「アナ雪」。こんな所にまで旋風を吹かせているんですね。とってもかわいい。 バックナンバー あわせてこちらもどうぞ。 Par […]

マークアップ

【怖くないJavaScript + jQuery】デバイスに合わせて特定のタグを挿入する

今日は、サイトを訪問したデバイスによってタグを追加するjsを書こうと思います。 タブレットやスマートフォンなど、CSSを追加したい時になんか便利ですね。 合言葉は「jQuery こわくない」です。 デモのファイルはこちらからダウンロードできます。 デモ ▼div(id=”apArea“)にデバイスに応じてテキストが挿入されます。 Step1:まず下準備 こちらはいつもと同じです。まず必要なファイルを読み込みます。 headタグの中に、jQueryと、自 […]

Webデザイン

【キャラクターデザイン】秩父市キャラクター公募に応募しました。

以前、このブログで公募のまとめを記事にしました。 その中で埼玉県秩父市が開催していた「秩父市イメージキャラクターデザイン」の公募。 実は私もプライベートの時間を使って参加していたのですが、悲しきかな、落選が決定したのでこちらに掲載することに。せっかくですしね。 秩父市の公募 リンク: 「秩父市イメージキャラクターのデザインを募集します!」 主旨として、市のイメージアップのため、りゅうごんに続く「「秩父市」をモチーフにしたイメージキャラクターのデザイン」を制作するというものでし […]

Webデザイン

Twitterまんが Part33

おはようございます。最近めっきり冬らしくなってきましたね。 皆様いかがお過ごしでしょうか。 私はというもの、年の瀬に向けて少々忙しくなってきています。 風邪引かないようにがんばって、年末まで駆け抜けていきましょう! さて、今日もほっこりと温かい気持ちになる癒しをお届けしたいと思います。 ちょっぴり息抜きにどうぞ。 新米パパ 本日書かせて頂いたツイート 今日はこちらのツイートを書かせて頂きました。 とっても幸せそうな家族ツイートが最近お気に入りです。 バックナンバー あわせてこ […]

マークアップ

【怖くないJavaScript + jQuery】「全てチェックする」を作る

今日はjQueryで、tableのチェック項目などでよくある「全てチェックする」のチェックボックスを作りたいと思います。要素の指定さえ合わせれば簡単に作れます。 合言葉は「jQuery こわくない」です。 デモのファイルはこちらからダウンロードできます。 デモ 実際に動かしてみるとこんな感じになります。 別ウィンドウで開く Step1:まず下準備 こちらはいつもと同じですね。まず必要なファイルを読み込みます。 headerの中に、jQueryと、自分で作ったjavascrip […]

Webデザイン

【キャラクターデザイン】ハロウィンおばけ

おはようございます。最近随分と秋めいてきましたね。過ごしやすい気温なのでとても快適です。 そんな中、スーパーやコンビニを見ているとハロウィンパッケージの商品がちらほらと出てきました。お月見が終わると行事ごとが一旦落ち着くので、ハロウィンは10月末にも関わらず随分早いです。 私もせっかくなので便乗しようと思い、キャラクターを作りました。 ゆるいキャラクターを作るのがとても楽しいですね。 先日秩父市キャラクター公募にも募集してみました。結果は10月だそうで、今とても楽しみにしてい […]

Webデザイン

Twitterまんが Part32

おはようございます。新しいiPhone、発表されましたね。今朝はずっとその話題で持ちきりです。私としましては、iPhone6 PLUSの大きさを見て、画面の解像度が変わってしまうのかしらと心配しています。片手で持ち切れなさそうだし大変だなぁ。 さて、今日もまんがを書かせて頂きました。 忙しいお仕事の合間に、ふふっと思って頂ければ幸いです。 指きり 本日書かせて頂いたツイート ちょっぴりクスっとしてしまいました。 バックナンバー あわせてこちらもどうぞ。 Part31 「スーパ […]

Webデザイン

【バナー】「オーネット」婚活バナー

先日お仕事で婚活サービスを調べることがあり、ブログやニュースを見るたびに「婚活」のバナーが表示されていてじわじわと精神が削られています。 その中でもひときわ目立つ大手婚活サイト「O-net」さんのバナー。他社と比べてデザインパターンが圧倒的に多く、知名度も高いのですが、皆様ご存知でしょうか。 少々内容が突っ込みどころ満載なこともあり、話題に上がったりしますね。お年頃の方はよく見かけるものではないでしょうか。 今回はそんな婚活のバナーを集めてみました。 感情に直接働きかけるよう […]

Webデザイン

実績を作るも良し、賞品を狙うも良し、公募まとめ

おはようございます。今週はお天気次第で気温の変化が激しいですね。 晩夏の折り、皆様いかがお過ごしでしょうか。 今日は公募をまとめみました。 デザイナーたるもの一度はこういったものに応募して表彰されてみたいですね。 自分の実績にもなりますし、賞品を狙ってお小遣い稼ぎにも良し。手軽に応募できるものもあったりするので、ぜひ皆様も一度検討されて下さい。 クリエイターさんでなくても。手軽に公募 奈良アニメメディア祭 愛称募集 ◆賞品: [最優秀賞]1名 キャラクターポスター・ポストカー […]

Webデザイン

Twitterまんが Part31

毎日まだまだ暑いですね。私はというもの、先日「アートアクアリウム」へ行って参りました。昨年ぐらいから話題になり始めた、いわゆる「金魚リウム」ですね。金魚とアートの織りなす不思議な世界、1時間待ちで入場しましたがとても美しかったです。 COREDO室町にも初めて行ったのですが、周辺アンテナショップやだし場もあってとってもオススメです。 さて、今日もまったりとまんがを書かせて頂きました。癒しの時間をお届けできれば幸いです。 スーパーカップ 本日書かせて頂いたツイート 暑いとなんだ […]

Webデザイン

宇宙を感動するミュージアム、『TenQ』に行ってきました

『TenQ』とは、先月、7月8日に東京ドームシティにオープンした、宇宙についての知識を深めることができる9つのエリアによって構成された、エンタテインメント・ミュージアムです。 国際宇宙ステーションから見下ろした地球の実写映像などを楽しむことができる「シアター宙(ソラ)」は、珍しい見下ろし型のプラネタリウムとして話題を集めており、東京の新名所として期待されています。 当日は夏休みが始まったところということもあり、たくさんの子供たちで賑わっていました。 結論から申しますと、大人で […]

Webデザイン

文字装飾パターン集

バナーやキャンペーンの画像を作る際、ゴテゴテのグラデーションやテクスチャをふんだんに使った文字装飾、大変ですよね。 大体値段やキャンペーンの内容となると分かりやすく金赤やゴールドが使用されるので毎度毎度マンネリになりがちだったりします。 そこで今日は、文字装飾のパターンを集めました。 Fireworksで開いてコピーし、「Shift + Ctrl + Alt + V」の属性をペーストを行うとそのままご自分のデザインに反映できます。

Webデザイン

【キャラクターデザイン】

今、社内でスマートフォンアプリを作りたいなぁと相談していたりします。 爆発的に流行るアプリなんかはやはりキャラクターが決め手だったりするんですよね。アルパカやマンボウ、なめこetc…可愛らしいですよね。私もちょこちょこと使用したいキャラクターをぼんやり考えてみたりしています。 せっかくなので綺麗に書き直してこちらに載せることに。

Webデザイン

TwitterまんがPart30

おはようございます。毎日暑いですね。私はというもの、相変わらず夏になるとバテてしまいます。皆様いかがお過ごしでしょうか。 最近の社内では夏に向けての(もう夏ですが)ダイエットも兼ねてか、「そば部」が発足しています。特に改めて部をつくったわけではないのですが、なんとなくランチにざるそばを食べる習慣ができてしまいました。いつもつい、3人くらいで蕎麦をすすっています。今のところはローソンのいなりずしがセットになっているのが一番人気です。曰くあまり無理して蕎麦だけで我慢すると「夕方く […]

Webデザイン

「LINEスタンプシュミレーター」を作りました。

LINEクリエイターズスタンプ、だいぶ盛況のようですね。審査を無事通過してマーケットに乗ったスタンプも4000を超えたようです。私もいくつか購入して使用してみたのですが、どうも実際にトークの場で貼られるとスタンプがなんかでっかい…。 制作している時は気付かないものなのですが、規約の370*320pxにめいっぱいで作ると実機で見ると全く違ったサイズ感になってしまい、結局なんだか使い心地が良くなくてそのまま使わなくなってしまったりします。 そこで失敗しないためにも、「LINEスタ […]

マークアップ

【怖くないJavaScript + jQuery】コンテンツの高さを自動で調整してくれるjs

ウィンドウの高さに対して、コンテンツの内容が少ない場合、footerより下の部分が真っ白になってしまう…しかし邪魔だしfooterをfixedにはしたくない。そんな時ってありますよね。 Sticky footerなど他にも手はありますが、内容が動的の場合使えなかったりするんですよね。 そんな時に便利な、コンテンツの高さを自動調整してくれるjsを作ってみましょう。実はとっても簡単なんです。 コンテンツ部以外(headerとfooterなど)の高さが固定であることが条 […]

Webデザイン

手書き風アイコン素材25個

今回は、アイコン素材を制作してみました。 ゆるい雰囲気の手書き風アイコンです。カラーもビビッドめにまとめました。 あぁーー、これね、こういうのよく使うよー、といった感じのを重点的に。 フリー素材で、商用可です。まとめてダウンロードはこちらから。 Fireworksで開くとパスデータになっています。 近況 オフィスの窓を開けると、とても綺麗な紫陽花が咲いています。 今年の梅雨は長いと聞いていたのに、もう明けてしまうなんて噂もちらほら聞きますね。あまり雨が降っていない様子ですが、 […]

1 3 4 5 6 7 12