こんにちは、デザイナーの姐さんです。 今回は、Photoshopで8bitゲーム風デザインをするときの設定やおすすめツールをご紹介します。 なお、この記事ではPhotoshopCC2021:22.3.1を使用しています。 「ググってわからないこと」が一瞬で解決するかも？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、現役デザイナーがマンツーマンで指導します！ ▼少しでも気になる方は、ぜひ公式サイトをご覧ください！ Photoshopの基本設定 ドットの大きさに合わせてグリッドを設定する まず、100×100の新規ファイルを作りました。 次に「編集」→「環境設定」→「ガイド・グリッド・スライス」を開きます。 出てきた画面のグリッドのところを調整します。区切り方もお好みですが、今回はサ

みなさんこんにちは！ デザイナーのえびちゃんです。 フォントってデザインの印象を決めるのにとても大事な要素ですよね。 フォントを変えるだけでガラッと印象が変わったり、しっくりこないな〜と思って先輩にレビューをもらったらフォントが原因だと気づいたり……。 ですが、デザインをはじめて間もないころだと、知っているフォントも少なく、出したい表現に近いフォントを探すのにも一苦労しますよね。 街中でよく見かけるフォント、使いたいけど名前がわからない、とかとか……。 そんなデザイナーの方に向けて、普段私がアイキャッチやバナーなどグラフィックデザインでよく使用している・使用したいなと思ってアクティベートしているAdobeフォントを、見せたいイメージ別に実際の制作物を用いながらご紹介します。 【LIGブログ編集部からのお知らせ】 独学でつまづいているなら「スクール」での勉強もおすすめです！ えびちゃんが学ん

こんにちは。ディレクターのたかしです。 デザイナーであれば、いつかフリーランスになって独立したい！と思ったことが一度はあるのではないでしょうか。 「次のステップにつながる仕事がしたい」「仕事をしながら新しいスキルを身につけていきたい」あるいは、「在宅で仕事がしたい」と考えたときにおすすめしたいのがクラウドソーシングです。 クラウドソーシングは、フリーランスのデザイナーとして仕事を発注してもらうのに有用な手段のひとつです。 そこで今回は、フリーランスのデザイナーがクラウドソーシングを利用するメリットと、受注前・納品時の注意点をランサーズ株式会社さんに教えてもらいました。 デザイナーがクラウドソーシングを使うメリット 実はフリーランスのデザイナーがクラウドソーシングを使うことで、さまざまなスキルアップが期待できるのです。ということで、デザイナーがクラウドソーシングを使うことによるメリットを5つ

あなたは「了解しました」と「承知しました」、どちらをよく使いますか？ 【アンケート】 「了解しました」と「承知しました」、どっちを多く使いますか？ — 菊池良 / Kikuchi Ryo (@kossetsu) 2016年2月25日 ツイッターでアンケートしたところ、こんな感じでした。わずかに「承知しました」の方が多いですね。 この2つの言い回しですが、「了解しました」よりも「承知しました」を使う方が正しい、とよく言われています。 僕がこれを初めて知ったとき、強い違和感を覚えました。理由は 「了解しました」をよく使っていた 日常でもビジネスでも「承知しました」を使っている人を見たことがなかった ある日、急に言われ始めた からです。「承知」が日常的な言い回しではなかったので、気になったんですね。 そこで調べてみたところ、いつから言われ始めて、どういう経路で定着したのかがある程度わかりました。

こんにちは、もう右上で言うことがないよ、づやです。 実はLIGでは10月を持ちまして、全社的に利用していたチャットツールを移行しておりました。 移行の経緯や、移行の時に大変だったこと、困ったことをもろもろ備忘録としてまとめさせていただきます。 そもそもLIGの事情はどうなっているのか 弊社株式会社LIGはいろいろな事業を持っています。 2019年10月現在で、Web制作事業、コンテンツ制作事業、ゲストハウス事業、コワーキング事業、飲食事業、教育事業、アート事業です。 また事業ではありませんが、経理や人事、経営企画室、監査役が１人に取締役が4人存在しています。いちばん人数が多いのがWeb制作事業です。チャットツールは全事業で使われており、使っていたツールは「Chatwork（チャットワーク）」でした。 LIGでもいろいろお世話になっており、個人的には思い入れのあるサービスです。 ※こんな記事

令和ですね。こんにちは。バックエンドエンジニアのまさくにです。ゴールデンウィークで休んでいたら、シュワシュワと筋組織が融解し、「自然に帰ろう……自然に帰ろう……」と遺伝子に刻み込まれた内なる声が僕を光射す方へ誘いました。もはや社会復帰は難しいかもしれない。 さて。さてさて。 皆さま、いかがお過ごしですか。新しい期に入り、心機一転したい気持ちでしょうか。何ならアレですか。お持ちのWebサイトをリニューアルしたい、そんな気持ちをそろそろお持ちでしょうか。 失礼ながら、そのお気持ち、 たぶん5ヶ月、遅いです！ 仕事としてWebサイトの制作に携わってから、5年くらいが過ぎました。現在はバックエンドの作業を行いながら、TD（テクニカルディレクション）やPM（プロジェクトマネージャー）として、プロジェクトに関わることも増えてきています。その観点から言って、お客様と我々の間には「Web制作」の考え方にお

「SublimeText 3」をDreamweaver感覚で使えるようカスタマイズ！便利なプラグイン12選まとめ こんにちは！　デザイナーのすーちゃんです。 変温動物ぎみなので冬は常時手が冷たく、コンビニのお釣りを受け取るのにとても気を遣います。あの、ちょっと上から落としていただいて構いませんので……。 さて、わたしは普段Dreamweaverでコーディングをしているのですが、ちょっとした修正などには「Sublime Text 3」を使っています。ただ、たまにしか使わないので、Dreamweaver感覚で使おうとすると凄まじいストレスが……！ そこで今回はしっかり腰を据えて、Sublime Text 3をDreamweaver感覚で使えるようにプラグインでカスタマイズしてみましたので、その方法をご紹介したいと思います！ わたしがSublime Text 3を使う4つの理由 まず、なぜDre

こんにちは、デザイナーのサリーです。 皆さんはSafariのリーダーモードを使っていますか？ 記事からheaderやfooterやCSSの装飾を取り払った「集中モード」で読むことができるという、Safariの機能です。 昔からある割にメジャーでないこの機能ですが（私も全然使いません＾o＾；）、隣の席のディレクターまさしは愛用していました。記事を読むときに、サイドバーや背景画像などの必要がない情報を目にしたくない、という理由で必ず使っているそうです。 人によってはなくてはならない機能なのかも……？ ということで、今回はリーダーモードの使い方や簡単な仕様などを調べてみましたのでご紹介します。 リーダーモードの使い方 使い方はとても簡単です！ アドレスバーの横の「リーダー」ボタンを押すだけです。 上のように会社概要ページやお問い合わせページなど、記事ではないページではリーダーボタンが押せません。

デザイナー兼踊り手のJona（＠jona_yawaraka）です。わたしはLIGブログに掲載されるアイキャッチ（ブログ記事の顔になる画像）、バナー、背景ジャック（大型バナー）など、さまざまな画像を製作してきました。 画像をつくって客観視したとき、「ある程度まとまってはいるんだけどなんだかしっくりこない。でも何が悪いかわからない……」ということありますよね。 わからないときはとにかく手を動かして、いろいろと試してみるとうまくいったりするもの。ということでデザインがしっくりこないときにとりあえず試したい10の簡単な方法を、私の経験を踏まえながら紹介いたします。 独学でつまずいていませんか？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。どんなスクールがあって、どんな内容が学べて、費用はどれくらいするのか、情

こんにちは、Webディレクターのともぞうです。 今回はディレクターならよく作成するスライドについてお話しします。スライドといってもPowerPointやKeynoteでつくるのではなくHTMLでつくります！ それでは、HTMLでスライド作成し、スライドをGitHub Pagesというサービス上に公開するまでの方法をご紹介したいと思います。 今回のゴール 先に今回のように私が作成したスライドを以下から確認してみてください。 https://lig-komatsu.github.io/statistics_01/#/ お作法さえ押さえれば簡単にスライドを作成することが可能です。 用意するもの 好きなエディター ライブラリ取得 GitHubアカウント とりあえずスライドだけつくりたい！　という方はGitHubアカウントを取得する必要はありません。 Gitを使ったことがなくてもスライドは作成できる

おつかれさまです。デザイナーのみやっちです。 最近モンハンワールドをプレイ中にコントローラーのUI設計ってどうやるんだろうなーと考えていました。限られたキーの中で配置をして、同時押しの押しやすさとか考えたり複雑なアクションに対応したりと、どうやって設計していくのか想像ができなくて、そっと考えるのをやめました。モンハン楽しいです（＾q＾） さて今回は【Adobeアプリ体験レビューvol.1】と題した通り、Adobeのアプリの使用レビューをお届けしようと思います。 なじみがない人が多いのではないかと思いますが、PhotoshopやIllustratorでおなじみのAdobeではスマートフォン用のアプリもリリースされているのです。Web制作やデザイン業務に使用できそうなアプリがいくつかありますので、「どんなことができるのか？」「どうやって使うのか？」などを紹介していきたいと思います。 Adobe

こんにちは、むむです。 企業のWeb担当の方々から日々たくさんのお問い合わせをいただく中で「とりあえず見積りをお願いしたい」というご要望を多くちょうだいします。こう聞かれる方の多くが、作る内容やサイトの概要が固まっていなかったりします。 お見積りを算出するにも、作るサイトのイメージがある程度固まっていないと、本当に概算のお見積もりしか算出できません。そのため、こちらもふんわりとした回答とならざるを得ないのです。これは「お互い、気持ちいいやりとりにはならない！」。そう感じる日々です。 LIGでは事前にいくつかの質問をさせていただき、その後に概算のお見積り算出をさせていただいております。 では、一体どんな部分を決めておけば金額変動の少ないスムーズな見積りが算出できるのか。Webサイトを作りたいと思ったときにどんな部分を考慮するべきなのか、まとめてみたいと思います！

みなさん、こんにちは。もーりーです。 最近は、ECサイトのデザインもかなり綺麗になって、そのブランドやお店の個性を全面に押し出すようなサイトが多いですね。 Web制作の現場では、EÇサイトのデザインを行うことも多いので、そんなときにどんなことに気をつければいいのか？自分なりにまとめてみました。 登録するテキストのそれぞれのページでの見え方 たとえば商品名は、ひとつ商品を登録するとトップページ、商品一覧ページ、商品詳細ページなど、さまざまなところに反映されます。 そのときに、このページでの見え方は綺麗だけど、他のページで見ると成立しないなど、あとで見ると整合性がつかないことが起こり得ます。ですので、常に他のページのことを気にしないといけません。 登録されるテキスト量が想定以上の量だった場合 デザイン上でのテキストの量ではきれいに見えても、運用のときにそれ以上のテキスト量が登録されることも多く

こんにちは、ディレクターのむむです。 サイトを作る時は、新規サイト制作か、リニューアルかの 2 択が主だと思います。リニューアルを行う場合は、今までの PV 数や UU 数をできれば引き継ぎたいと思いますよね。 その際によく聞かれるのが「リダイレクト」です。 リダイレクトとは一体どのようなもので、どんな種類があるのか。この点について、自分なりにまとめてみました！ リダイレクトとは 指定した Web ページから 自動的に他の Web ページに転送されることを指します。 リニューアルなどサイト URL が変更した場合に、旧 URL から新 URL へ誘導するときに用いられあるアレのことですね。 リダイレクトの種類 実はリダイレクトにもいろんな種類がるのはご存知でしたでしょうか？ 私は正直こんなにあることを知りませんでした。 「 301 と 302 だけじゃなかったんだ」というのが正直な感想です

今回はつるっとしたオブジェクトを簡単に紙っぽくする方法をご紹介します。 01:境界をざらざらにする まずは長方形ツールで白い四角形を描きます。 次に長方形の選択範囲を選択して、クイックマスクモード（ショートカット：Q）に切り替えます。 クイックマスクモードの状態で、フィルタ→ピクセレート→水晶を選択します。 クイックマスクを解除すると（もういちどQを押す）と選択範囲がギザギザになっているので、その状態でレイヤーマスクを追加します。 紙がギザギザになりました！ついでにドロップシャドウもやんわりかけちゃいましょう。 02:紙をしわくちゃにする 次は紙のしわくちゃした質感を表現します。 ギザギザ部分を選択して（Ctrl+レイヤーマスクサムネイルクリック）、新規レイヤーを追加したあと、黒→白のグラデーションをランダムにかけます。 補足：グラデーションの描画モードは「差の絶対値」にしてください。その

こんにちは、デザイナーの王です。 今回の記事ではCompass使いになるための必要最小限の知識から応用まで、体系的にひと通り紹介していきます。 全くの初心者でも問題ありません！ はじめに結論を言うと、CompassでCSSを書くと 早い！ 見やすい！ メンテしやすい！ コード量がぐっと減る！ 一度使い出したら最後、もう元には戻れない！ 一体どこまで便利なのかずらずら書くよりも、百聞は一見にしかず！ 簡単なプロジェクトを通して、各特徴について紹介した短いデモ動画を用意したので、まずはこちらを見てください！ Compassとは？ Compassを語る前に、まずは「Sass」を知っておく必要があります。なぜなら、CompassはSassを元に開発したフレームワークだからです。 Sassとは では「Sass」とは何かと言うと、正式名称は「Syntactically Awesome Style Sh

こんにちは、デザイナーのぺちこです。 先日、「Bootstrapも標準化したDreamweaver CC 2015を使って、レスポンシブデザインを爆速で作る方法」という記事を執筆したところ、多くの方に見ていただけて嬉しく思っています！　ありがとうございます。 前回の記事を執筆したあと、「Dreamweaver CC 2015でどこまでできるかな？」という考えがふつと湧きました。 私自身はもともとコーディング大好きっ子なのでパチパチ打つのが好きなのですが、先日初めてビジュアルエディタをさわったので、「一切コードを書かないでどこまでできるのか」というチャレンジをしてみようかなと！ 「手打ちのほうが早いんじゃない？」と思う方も、普段触らないツールがどのくらいの力を秘めているのかを見学する気持ちで読んでいただければと思います！ そして「コーディングはできないんです……」というデザイナーさんは、まず

こんにちは、ニュージーランドで働くプログラマのはっしーです。 4月に入り、初めてIT業界で働き始めた方も多いのではないでしょうか。IT業界は、刺激的で楽しい世界です。しかし、一歩間違えれば残業地獄に足を取られて社畜生活まっしぐらという危険もあります。僕もそんな落とし穴に陥った人間のひとりです。 今回は、僕が日本とニュージーランド（以下、NZ）で働いて見つけた、IT業界を楽しく生き抜くコツについてご紹介します。特に未経験からITエンジニアになった皆さんに読んでほしいです。 <他にも働き方のヒントになる記事を書いています！> 日本のITエンジニアは安売りしすぎ？ニュージーランドの労働環境が羨ましすぎる あなたの職場「ホウレンソウ」に時間かけすぎ？コミュニケーションを効率化させる具体的な方法 納期を守ることが仕事じゃない。「納期至上主義」から脱却するために締切と上手につきあう方法 残業はしない！

こんにちは、ニュージーランドで働くプログラマのはっしーです。 IT業界で働いていると、どうしても無縁ではいられないのが納期です。クライアントへの納品だけでなく、上司からの依頼や社内資料作成など、締切の決まっている仕事が多いのがこの業界での特徴でもあります。 皆さんは納期に苦しめられていませんか？　締切に追われて毎日残業、ときには休日出勤なんてことはないでしょうか。今日はニュージーランド（以下、NZ）の働き方から、締切と上手につきあう方法を探ってみましょう。 <他にも働き方のヒントになる記事を書いています！> 日本のITエンジニアは安売りしすぎ？ニュージーランドの労働環境が羨ましすぎる あなたの職場「ホウレンソウ」に時間かけすぎ？コミュニケーションを効率化させる具体的な方法 日本とNZの違いに学べ！　新社会人に贈る、IT業界を楽しく生き抜くコツ 残業はしない！定時までに仕事を終わらせるための