制作

Three.jsでメロンソーダ

みなさんはメロンソーダはお好きですか？あの鮮やかな緑色とシュワシュワの魅力に取り憑かれています。今回は「Three.js（WebGL）」を使ってメロンソーダを作ってみようと思います。

XD実践編　模写をしてみよう-実行前半-

前回のXD実践編に続き、今回は実際に模写をしていきます。コンテンツ幅やグリッドなどバランス面、配色やフォントなどのデザイン面に注目して見つつ、組み立ていく前の段階までやっていきます。

伝わる文章の書き方

数ある伝達手段の中でも、文章は特に不安定な伝達手段です。少なからず生まれてしまうズレを出来るだけ減らせるよう、相手に伝わる文章の書き方、文章力の鍛え方をご紹介します。

伝わりやすいバナーの作り方

一番初めに携わったデザインがバナーでした。今回は広告用バナーについての制作の流れとポイントなどを、私が初めて作成した時の話も少し交えながらご紹介できればと思います。

GoogleMapの縮尺変更

多くのサイトで利用されるGoogle Mapのiframe形式ですが、縮尺が残念だなと感じることがあります。せっかくマップを埋め込んでいるのであれば、適切な縮尺で表示しておくのがベストだと思います。

XD実践編　模写をしてみよう-準備とポイント-

XDの実践編としてXDの基本的な操作画面をご紹介しつつ、「サイトの模写をしてみる」ということをテーマに書いていきます。今回は模写をするための準備とポイントについてまとめてみました。

バナー訴求で注意すべきこと

バナーの訴求に関して、様々な企業の公平性を保つため、不動産広告業界では使用制限用語が定められています。今回はYahooとGoogleへバナー広告を入稿する際の注意点をご紹介していきます。

flexboxとfloatのちがい 2

前回の記事に引き続き、今回は「float」に関してと本題の「flexboxとfloatの違い」についての記事です。それぞれの良い点、悪い点を理解して知っていただけたらいいなと思います。

flexboxとfloatのちがい 1

コーディングを学び始めた人が割と初めに出会うであろう「flexboxとfloatの違い」に関しての記事を2回に渡ってお届けします。今回の記事ではまず「flexbox」に関してお話します。

サイトマップを作ろう

サイト制作をする際、その前に取り掛かる作業としてサイトマップを作成します。ということで今回の制作ブログはサイトマップの必要性や作成方法についてお話しさせていただきます。

言葉を紡ぐ、広告コピー

今回の制作部ブログは広告コピーについてお伝えしたいと思っております。傑作コピーを独断と偏見でご紹介し、また私がコピーライトの際に心掛けていることも踏まえてご紹介できればなと思います。

【SEO】Web Vitals

今回はGoogle検索順位の新指標「Web Vitals（ウェブバイタル）」についてです。Googleが2021年5月にコアアルゴリズムに組み込む（予定）と発表している、新しい検索ランキング指標です。

XD実践編　アートボードの設定とガイドの引き方

前回「XDのすヽめ」を書いたので、今回は実践編として、実際にXDを使ってサイトデザインする方法について紹介します。私自身初期で結構迷った部分でもあるのでぜひ参考にしていただければと思います。

CSSセレクタの指定方法

コーディング業務に携わっている人でもセレクタの指定方法を意外と知らない人も多いのかなと思います。なので今回は、CSSセレクタの指定方法に関しての記事を書かせていただきます。

色について

タイトルの通り、今回は「色」がテーマです。世界に溢れる色について、制作現場の観点からご紹介させていただきたいと思います。また、色の与える印象についてもお伝えできればと思います。

ブラウザの種類とキャッシュクリアの方法

ブラウザって聞いたことありますでしょうか？今回は入門編ということで「ブラウザの種類と各ブラウザのキャッシュクリアの方法」についてお話をしていこうと思います。

【SEO】パンダアップデート

Googleの検索順位への影響が大きく、Web担当者であれば意識せざるえないアップデート、今回はそんな「パンダアップデート」についてご紹介していければと思います。

画像ファイル形式の違いとは？

今回の制作部ブログは「ファイル形式」について。改めて調べてみると本当に多くの種類があり、使い分けが難しいと思われがちです。そのため、今回は画像ファイル形式の違いをご紹介していきます。

WEBサイトの主要ページ

去年12月に「サイトのつくり」として簡単なWEBサイトの構成についての記事を書きました。少し間が空いてしまいましたが、今回はWEBサイトの主要ページについての記事を書きたいと思います。

【SEO対策】URLの正規化

現在運用されているサイトの「URLの正規化」はされていますか？今回はサイト状況を確認する上での第一歩とも言える「URLの正規化」についてお話していければと思います。

XDのすヽめ　AdobeXDが想像以上に便利

今回の制作部ブログは、最近チャレンジしたAdobeXDについて書いていきます！AdobeXDが想像以上に使い勝手が良く、備忘録を兼ねてその魅力を伝えられたらなと思います！

入門フォントについて

デザイナーとして働いているため、ポスターや看板、本の表紙など「見た目にこだわっているもの」を見てしまう事が多いです。今回のブログは誰もが使えるような「フォント」のお話をしたいなと思います。

技術Illustratorでロゴ入りQRコードを作成しよう

QRコードはスマートフォンが普及したこともあり、さまざまなところで利用されていますよね。デザイン性の高いQRコードもよく見かけます。そこで今回は「ロゴ入りのQRコードの作り方」をご紹介します。

技術【API不要】Google Mapの色を変える／iframe形式

Google MapはGoogleを代表する地図検索サービスで、外部のサイトやブログへの地図の表示も可能です。そんなGoogle Mapをサイトに表示させる方法や色を変える方法など、ご紹介いたします。

技術CSSでドット絵を書こう

みなさんはドット絵をご存知ですか？ドット絵とは、出力最小単位の小さなマス目を塗りつぶし、それを並べて絵を書いていく技法です。今回はそのドット絵をCSSで書いてみたいと思います。

入門サイトのつくり

WEBサイトをつくる「ヘッダー」「フッター」「ナビゲーション」などの各要素について説明しています。サイトにあるこの部分はこういう名前でこんな意味があるよって感じで、ひとつずつ覚えていきましょう！

入門コーディングとはこんなものだよ

新卒の方や未経験の方向けに、コーディングについての記事を書きました。未経験の方はなかなか馴染みがないかもしれませんが、なんとなくでもコーディングってこんなものだよが伝われば嬉しいです。

技術SVGを使ったアニメーション

今回はSVGを使ったアニメーションの作り方をご紹介します。ページを開いたタイミングで、サラサラっとロゴが描写、フェードしてページが表示される、あれです。いつかなにかの案件で実際に使ってみたい。

入門Illustratorでミッフィーライン

温もりのあるデザインといえば、質感のあるモチーフが定番だと思います。そんな中でわたしが気になったのは、ミッフィーラインです。ラインがクーピーで書いたような感じで、自然に少し震えてるんですよね。

みんなの顔をイラストアイコンに

今回のサイトリニューアルは、デザインやコーディングはもちろん、構成も制作部が主体となり決めていきました。その中で意外にも長いこと悩んだのが「スタッフ紹介」ページを作成するかどうかです。