【初心者向け】ひと手間でデザインの物足りなさを解消する方法まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、新人デザイナーのナガレダです！ 社内制作チームでLIGブログのアイキャッチやバナーなどを作っています！ 日々デザイナーの先輩にフィードバックしていただき、発見と学びのある毎日です。 皆さんはデザインをしているときに、「ラフの通りに作っているのに何か物足りないな」と感じることってありませんか？ 私はめちゃくちゃあります。 素材を作って実際に画面に当てはめて完成間近！ でもあれ？ なんかさみしい……ってなることが多いんですよね。 そんなときに先輩デザイナーに教えてもらった、ひと手間加えるだけで物足りなさを解消できる方法をまとめてみました！ また、本記事と同じ内容をYouTubeにもUPしています！動画や音声で楽しみたい方はこちらを参照してみてくださいね。 デザインの物足りなさを解消する方法 文字周りに飾りを入れてみる before クライアントのWebサイト用に作成した「スマホによ
AdobeXDで更新しやすいテーブルの雛形を作ってみた〜コンポーネント・スタック・パディング機能の活用〜 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、Webディレクターのイナッチです。 今回は、Adobe XD（以下：XD）で更新しやすいテーブルのひな形を作りましたので、ご紹介します。 せっかくなのでなぜ更新しやすいテーブルを作ろうと思ったのか？ なぜ作れたのか？ などの背景も合わせてご紹介いたします。が、そんなことはいいから早くテーブルを見たい方は、もろもろスキップしてこちらからどうぞ。 XDで更新しやすいテーブルができるまで XDといえばWebサイトなどの画面デザインのためのソフトというイメージですが、その使い勝手の良さから、デザイン以外の場面でも活用する機会が増えてきました。たとえばLIGのアカウントプランナーのノブさんは、企画書（提案書）をXDで作られるそうです。
非デザイナーは「生成AI」でどこまでUIデザインを作れるのか？ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Technology部の永松です。 私が在籍しているTechnology部ではさまざまなシステム・アプリ開発を手がけています。 しかし、部内にはデザインやUIUXの知見がまだ足りていないのが実情です。 実際にデザインをするときは、他部署のデザイナーに力を借りることがほとんど。 ……近年こんなに生成AIが進化しているのであれば、これらを使って自分でデザインを作成することはできないものでしょうか？ WF（ワイヤーフレーム）の作成だけでもいいんです。これらが誰でもできるようになれば、もっとお引き受けできる案件も増えるはず。 というわけで、今回はクライアント提案に耐えうるデザインを生成AIでどう作るのか、試行錯誤した結果を紹介します。以下のツールについて感想をまとめていますので、ぜひ参考にしてください。 今回試したサービス ChatGPT Midjourney(+Vary Region) Fram
Webサイトリリース前に確認すべきSEO内部施策10項目をご紹介！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、制作事業部WebディレクターのZIMAです。 みなさん、SEO内部施策やってますか？ やっていないわけないですよね。しかし「どこまでやってますか」と聞かれると……困っちゃう人多いのではないでしょうか。 実は自分もどこまでやればいいんだろう？ と思って、我らがづやさんに聞いてみたところ「ふむふむ、それなら、 ちょうどいいの作ってるから、勉強がてらZIMAがつくってみてよ」と、ひょんな流れから私がLIGのSEO内部施策チェックリストを作成することになりました。 せっかくなのでブログにして自分の学びをみなさまに共有したいと思います！ そもそもSEO内部施策ってなんだ？ Webサイトの中身をGoogleなどの検索エンジンに正しく伝えたり、ユーザーがストレスなく利用できるようユーザビリティを向上させるための施策のことです。 世界中のWebサイトをクローリングしているのは簡単に言えばロボッ
Illustratorでイラスト描くときに便利なツールまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうもデザイナーのナガレダです〜。社内デザインチームでLIGブログのアイキャッチやバナーの制作を行っています。 最近コロナの影響もあり、オフラインでの撮影の機会が減りました。アイキャッチなどでもイラストを描くことが増えてきています。 もともとイラストを描くことが好きで、趣味で描くときはイラストを描く専用のソフトを使っていました。なので、正直Illustratorでちゃんとしたイラストなんて描けるわけないだろ！ と思っていたのですが……。 Illustratorをいじっていくうちに、すんごいイラスト描きやすいツールが多いことが判明してしまったので、よく使う便利ツールをご紹介します！ 「わからないこと」が一瞬で解決するかも？ Illustratorについて効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、
面倒くさがりな私がMacでよく利用している業務効率化アプリ5選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
彼のこの記事を読んで、使い始めました。 タスク管理ツールって、過去いろいろと使っているんですけど、なかなかしっくり来るものがないんですよね。結果的に、Googleカレンダーにタスクを登録したり、メモ帳にToDoを記載したり……。 ただ、このRemember The Milkを使うと、なんかテンションが上がって抜け漏れなくタスク管理ができる。いやいや、絶対褒めすぎでしょって思ってたんですけど、いや、便利っすね。これはマジで。 詳細はここでは説明しません。もう、まさくにの記事を読んでください。 私は、無料プランを使っているんですけど、たしかにこれは有料プランを契約しても良いレベル。 Transmit https://panic.com/jp/transmit/ 続いて、FTP/SFTPクライアントのTransmitです。 今までは、Forkliftを使っていたんですけど、ここ一年くらいでこのソ
WordPressでWP-CLIを使って記事移行とかを少し楽にする | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、エンジニアのづやです。 ここのところ、「CSVからWordPressにデータを取り込みたい！」「ルールに沿って特定のカテゴリを違うカテゴリに付け替えたい！」などのお話を受けることが多かったので、苦労した点とかを共有したいと思います。 気軽なやり方 全然大したことない処理のときは、phpファイルを作って、WordPressだけ呼び出して処理ですね、お手軽。 <!--?php require_once "wp-load.php"; // パスは環境によって変えてね ?--> これを読み込んだら、WordPress関数が使えるので、CLIからphpとして実行したり、まあdocument rootにおいて実行して消すなりしちゃえばOKです。WordPress管理外じゃないけど、WordPressの記事を引っ張りたいときとかと一緒ですね。 たまに「wp-blog-header.php」を
サイト公開前のブラウザチェックを簡単に行う方法。不具合発見後の対応も解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
うどん県出身・Webディレクターのセイタです。夏にジムへ入会しましたがバキバキな身体にはなりませんでした。来年の夏はビーチのスターになれるようにやっていきます。 さて今回は、制作したWebサイトの公開前に必ず実施する、ブラウザの表示テストについて学び直したことをまとめました。 制作が完了し、これでリリースできる！ と喜ぶのはまだ早い。このテストを完了させてこそ、はじめてきちんとした状態で公開を迎えられるのです。 なぜブラウザの表示テストを実施するのか？ 先に結論から言うと、さまざまな端末およびブラウザにおいて制作したWebサイトの品質を担保するためです。 もう少し柔らかく言い直すと、ユーザーは様々な環境でWebサイトを閲覧するため、どの環境においても問題なくWebサイトが表示されるようにテストする、ということです。 ユーザーが閲覧する環境は端末だと、下記がありますね。 Windows Ma
【作例付き】WebデザインにおけるAdobe After Effects活用法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
今回は後編ということで、モーションデザインの作り方を実例を元に紹介していきたいと思います。実際のサイトに使うには色々足らないですが、After Effectsで制作する際のテクニックを交えて解説していきます。 この記事はこんな方におすすめです モーションデザインに興味がある Webサイトのアニメーションを自分で作ってみたいデザイナー After Effectsを触ってみたい また、制作にあたってこちらのサイトを参考にさせていただいております。様々なモーションの作例を周期表に見立てて紹介していて、ダウンロードもできるためどのように制作すれば良いかも見れるようになっています。 画像引用元：モーション周期表 Webデザインでモーションデザインを利用する機会 デザイナーがモーションデザインをWebデザインに取り入れる機会としては以下があるかなと思います。 デザインの提案 エンジニアとの共有 動画ま
サイト改善の神ツール！？無料で使えるユーザー行動分析ツール「QA Heatmap Analytics」がスゴかった件 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
サイト改善の神ツール！？無料で使えるユーザー行動分析ツール「QA Heatmap Analytics」がスゴかった件 みなさんこんにちは、外部メディアコンテンツ制作チームでリーダーをしているやぎです。普段はさまざまなオウンドメディアの記事制作代行や運用支援をしています。 突然ですが、私と同じオウンメディアのコンテンツ制作に関わっている方は重々承知かと思いますが…… 記事は「作って終わり」じゃないんです！！！ メディアを成長させるうえでは、作った後がもっとも重要といっても過言ではありません！ ただ作って終わりではなく、コンテンツ設計にあたり決めたKPIに対する進捗はどうなのか、といった効果測定を日々実施し、PDCAサイクルを構築していくことが重要であり、もっというと”C”の「Check（評価）」 、つまり記事の「分析」 を怠ると、メディアの成長はできません！ さぁみなさん、今すぐに自社のオウ
はじめまして！ 株式会社LIGでコンサルタントをしている、わべと申します。 さっそくですが、皆さんは「デザイン思考」という言葉を聞いたことはありますか？ 学生の方はあまり聞き馴染みのない言葉だと思いますが、社会人の方は最近耳にする機会が増えてきたのではないでしょうか。 デザイン思考という言葉をはじめて聞く人からすると、「デザイン思考ってデザイナーの人がやってるあのデザイン？」と思われるかもしれません。しかし、デザイン思考≠デザインで、今や多くのビジネスパーソンに求められるスキルとなりつつあります。 そこで今回、私がデザイン思考とは何か、そしてデザイン思考を学ぶ中で気づいた点をまとめてみました。デザイン思考という言葉を耳にしたことはあるものの、具体的な内容についてはあまり理解できていない方や、これから学んでいきたい方は是非参考にしてみてください！ デザイン思考って何？ デザイン思考とは、一言
控えめに言って万能なSEOツール「パスカル」でコンテンツSEOを時短してみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、LIGのエディターののぞみーるです。 私は普段、お客様のメディア運用やサイト内のコンテンツ制作を担当しており、面白系だったりインタビュー系だったり様々な企画を作っていますが、SEO施策のご依頼も多くいただきます！ 突然ですがSEOに携わるみなさん、 SEO作業って時間がかかりませんか？ 何百記事書いても目標のアクセス数に届かなかったり、SEOの項目に気をつけてリライトしてるのになかなか順位が上がらなかったり、なんてことよくありませんか？ SEO施策って事前調査にめっちゃ時間がかかるわりに、正しい分析ができていないとなかなか成果には結びついてくれません。SEO嫌いになりそう……と苦手意識を持っている方も多いのでは。 他にもこんな課題があるのではないでしょうか？ SEOコンテンツ制作担当者の課題あるある SEOに関して社内にしっかりとしたノウハウがない 知識量や編集力が属人的で、成
Illustratorの3D効果で作る、簡単アイソメトリックなイラストの作り方 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーの花ちゃんです！ 最近、Webサイト制作の案件でアイソメトリックのイラストを作る機会がありました。 アイソメトリックとは、アイキャッチにもあるような、物体を斜め上から見下ろしたような図形のことをいいます。 はじめはこの斜めから見た角度はどうやって作ればいいんだ……？ 俯瞰でイラストを描くのって一番難しいのに……！！ と思っていたのですが、Illustratorの「3D効果」というとっても便利な機能に出会ったおかげで、作るのが楽しくなってきました！！！ 今日はクリスマスということで、アイソメトリックな「プレゼント」と「クリスマスツリー」を作ってみましたので、その方法をご紹介いたします！ アイソメトリックについてはゆうこさんのこちらの記事をご覧ください。
CSSではじめるクリエイティブコーディング・パーティクルアニメーション | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
はじめまして、2020年6月に入社したくりちゃんです。 前職でもフロントエンドエンジニアとして約1年ほど、おもにLPたまにコーポレートサイトを制作していました。Webのアニメーションやインタラクションをもっと実装したいなと思い、ご縁があってLIGに入社することになりました。 See the Pen Particle Rotation #03 by Hisami Kurita (@hisamikurita) on CodePen. プログラムで絵やアニメーションを作ったりすることが好きで、仕事でもプライベートでもよくCSS AnimationやCanvas 2D、three.jsを使って上記のようなものを作っています。個人で制作した作品はほとんどCodePenにあげているので、興味があれば見てみてください！ ということでLIGでの最初の記事は、上記のようなパーティクルアニメーションの作り方を
才流栗原氏に聞く！これからのBtoB営業・マーケティング、コンテンツ制作を適切に導くフレームワーク【保存版】 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
時は満ちました。市場の変化とともに営業やマーケティングの手法も変革せざるを得ないウィズコロナ時代の今こそ、あの方にお話を聞くしかない！ ……ということで、BtoBマーケティングのプロコンサルタントである株式会社才流（サイル）代表の栗原さん（@kotakurihara）に取材させていただきました！！！ （才流栗原さん・ベイジ枌谷さん・WACUL垣内さんのことはかねてよりBtoBマーケティングの三大天として崇めておりましたので、こうして連続で取材の機会をいただきものすごく光栄です……気持ち高まります……！！！） ※編注：三大天はマンガ『キングダム』に出てくる趙の英雄たちの架空の総称です。 BtoB営業・マーケティングの戦略立案〜実行支援を事業として展開されている立場から、今現場でどのような変化が起きているのか、短期的・中長期的になにから順に取り組んでいくべきなのかをお話しいただきました。 また
openmediavaultを使ってラズパイでNASを自作してみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ BiTTチームのキー坊です。 今日はお題の通りNASを作っていこうと思います。 というのも、この記事を書いている2021年5末で、Googleフォトの無料利用が終了するということもあり新しいストレージ先を探しています。NASもその候補の一つですが、値段高いものが多いため手が出しにくいですよね。 うちにも稼働しているNAS（QNAP TS−231P）があるのですが、そろそろ容量逼迫が見え始めてます。調べてみると自作で安く仕上げることができるようなのですが、やはりパフォーマンス面が心配ですよね。 その辺りの疑問にお答えするような記事にしましたので、最後まで読んでもらえると嬉しいです！ 僕と同じようなストレージ難民な方いましたら、ぜひ参考にしていってください。 用意するもの ラズパイ4（ラズパイ3でも動作すると思いますが、LANが遅いので非推奨） データ保存用USB接続HDD NA
【保存版】リモートワークの「Web会議ルール」をつくりました！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
かれこれ2ヶ月半ほどリモートワークを続けていますが、Web事業部ではより良いWeb会議・オンライン会議のため、あらためてルールづくりを行うことにいたしました。 リモートワーク中の皆さん、またはこれからリモートワークを導入する予定の皆さんの参考になれば幸いです！ ルールづくりする上でのリモートワーク環境 普段から使用しているWeb事業部の環境・利用ツールは以下のとおりです。 全員がノートPCでの作業環境 普段から会社支給Macを使用して作業をしています。 全員1台ずつ貸与されているモニターの社外持ち出しOK 一人一台ずつデスクに貸与されているモニターですが会社指示のリモートワーク期間は、持ち出しOKとなりました。 データ共有はGoogleDriveを活用 社内だけでなくお客様とのやり取りもGoogleDriveを用いて行っています。 Googleドキュメント／スプレッドシート／スライドを活用
システムが脆弱になっていませんか？AWSのセキュリティ設計の基本を解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうも、LIGのテクニカルディレクターのおきくです。 最近はPM業務が多くなり、本来のテクニカルディレクション業務から離れることも多いですが、相変わらず技術に対する知識欲は衰えておりません（笑）。 さて今回ですが、案件などでよく設計やディレクションすることが多い、セキュリティ設計（サーバーサイド限定）についてお話ししたいと思います。このブログを通じてみなさんのセキュリティ設計に少しでもお役立てできたら幸いです。 インフラ関連について インフラ関連だと様々な観点での設計が必要になりますが、主に以下観点での設計が必要です。 アクセス管理 WAF 侵入検知・防御 アクセス管理について 様々な観点でアクセス管理を実施する必要性があります。 基本的な考え方としては、各リソースやサブネットワークへのアクセスについて許可されていないIPやサービスからのアクセスを禁じる、想定外なアクセスを行わないようにす
【2019年版】Macユーザーに超絶おすすめのアプリ／ツール10選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
オフィス外で作業することが多いため、これは超絶愛用しています。人目に付くカフェ等の環境で作業されている方々におすすめです。周囲にMacの画面情報を見えづらくするだけでなく、ブルーライトカット効果もあり、一石二鳥。 また、マグネット型になっているので、取り外しが容易で、隣の人に画面を見せたいときには、即座に取り外しができます。 Nums ナムス（ランチャー トラックパッドカバー） Nums これまでにないトラックパッド トラックパッドが、なんとテンキーになったりアプリランチャーになる優れものです。 管理業務を行うと、スプレッドシートや電卓作業が増えていきます。外出時など、外付けのテンキーキーボードがにないときに、このランチャーを立ち上げるだけで、トラックパッドをテンキー化でき、作業効率が格段にあがります。 業務効率化ツール・アプリ Memory Clean 2（メモリ解放／管理） Memor
画像を遅延読み込みしてみよう！Intersection Observer編 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
年齢なんか関係ない！ 人生史上今が一番！ Webのパフォーマンスもブチ上げていきたい、フロントエンドエンジニアのザワです。 lazyload（レイジーロード）、Web業界では耳慣れたワードになってきたのではないでしょうか。 Webページの表示を高速化するために、ページロード初期時には画像は読み込まず、表示したいタイミングでロードを開始するアレです。「lazyload」だの「遅延読み込み」だのいってますが同じことを指しています。気分と話し相手によって変えていきましょう。 今回は2つの方法を2回に分けて実践していきます。 Intersection observerを使用する方法 loading属性にlazyを適用する方法 Intersection observerが一般的になる以前は、scrollイベントで随時要素の位置を取得して、みたいなことをやっていたと思いますが、そんなオールドスクールな
Docker+WordPressでXdebugを使う手順 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。小林です。 単刀直入に言いますと、この記事を読むと「Docker+WordPress」の環境でXdebugを使えるようになります。早速ですが説明していきます。 はじめに まず私の開発環境の紹介です。 （マシンは6年前にフルスペックだった）MacbookPro （IDEがないと何もできないので個人的に最強のIDEだと思っている）PhpStorm （いろんな開発を並行するのでとっかえひっかえしやすい）Docker と、こんな環境で普段開発をしているのですが、久しぶりに大規模なWordPress案件に携わることになりました。 その案件では、馴染みのないプラグインを多数入れたり、そもそも最新のWordPressの機能を把握できていなかったりと、いくらPhpStormを利用しているといえども、それぞれの機能を追うのがなかなか難しい状況でした。 そこで、久しぶりにXdebugを頼ることを決
「これってなんだっけ？」なデザイン様式の名前について調べました。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
おつかれさまです。デザイナーのほそです。 「このデザインテイスト見たことあるな、でもどういう名前なんだろう？」 「こんなテイストを探したいけど、言語化できない……」 と思うことはないでしょうか。 今回は、「これこれ！」っていうのがわかると便利なデザインの様式に関する用語をご紹介します。AdobeStockで使えそうな素材も探してみたので、そちらのリファレンス付きです。 いろいろなデザインテイスト用語まとめ Bauhaus Design｜モダンデザインの源流 引用：Bauhaus Design Images – Browse 1,744 Stock Photos, Vectors, and Video | Adobe Stock 幾何学的かつミニマルで直線的な印象を受けるグラフィック。 引用：https://en.wikipedia.org/wiki/Bauhaus バウハウスとは、1919
【無料】高精度&爆速で文字起こしが終わるAIツール「Gladia」がスゴイ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、インハウスマーケティング部のかけるです。 生成AIによってライティング業務の効率化が進むなかで、「文字起こし」は生成AIが得意とする領域の一つです。 今回は数ある文字起こしAIのなかでも、実際に使ってみて良かった文字起こしAI「Gladia」について、その使い方や魅力をご紹介します！ 「Gladia」は精度が抜群 https://www.gladia.io/ まず前提として、Gladiaの文字起こしの技術には、OpenAIがオープンソースとして公開している文字起こしAI「Whisper」が活用されています。 Gladiaの大きな魅力は、なんといっても音声から文字を起こす（Speech-to-Text）際の精度の高さです。 一般的に、音声認識の精度は「単語誤り率 （WER）」という、その音声認識モデルが音声をテキストへ変換する際にどれぐらい間違えてしまったのかという評価尺度があり
こんにちは、Technology部のジョシュです。 今日は、最近バズっている生成AIモデル「Claude 3」と「GPT-4」を比べてみましょう！ 生成AIが絶え間なく進化し続けるなかで、2024年3月に登場したAnthropic社の大規模言語モデルClaude 3。OpenAI社のGPT-4と比較され、多くの議論を呼び起こしています。 この記事ではこれら2つのモデルを深掘りし、それぞれの特徴、能力、そして生成したコードの結果を比較しながらご紹介します。生成AIのトレンドを知りたい方やAI開発に関心を持つ方々のご参考になれば幸いです。 GPT-4とClaude 3の概要 OpenAI社が開発した言語モデルGPT-4は生成AIを広めたモデルとして非常に有名で、様々なタスクをこなす能力があります。そんな中で3月に登場したAnthropic社のClaude 3は、いくつかの分野ではGPT-4を上
フィルタ不要で並び替えができる夢のようなSORT関数【Googleスプレッドシート/Excel】 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
SORT関数 使い方 関数の説明はこちらです。 ※記事内の画像はGoogleスプレッドシートで作成し、数式の表記もスプレッドシートをメインとしています。Excelでも部分的に同じように利用することができます。 関数 Googleスプレッドシート =SORT(範囲, 並べ替える列, 昇順(TRUE)or降順(FALSE) [ , 並べ替える列2 , 昇順or降順2 , …] ) ※[ ]は条件を2つ以上指定する場合です。カッコは入力しません。 Excel（Excel for Microsoft 365以降で対応） =SORT(範囲, 並べ替える列, 昇順(1)or降順(-1) ) ※Excelの場合、指定できる条件は1つです。 SORT関数は、指定した範囲のデータを、指定した列で昇順もしくは降順で並べ替えて、別の場所に表示することができる関数です。スプレッドシートでは複数の条件を指定すること
「施策のフィルターを外せ」。神楽坂のbarで出会ったツイ廃おじさんから、古くて新しい、マーケティングに大切なことを教えてもらった話。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
「施策のフィルターを外せ」。神楽坂のbarで出会ったツイ廃おじさんから、古くて新しい、マーケティングに大切なことを教えてもらった話。 みなさんこんにちは、マーケターのまこりーぬ（@makosaito214）です。 今回は、後輩のなりちゃんと訪れた神楽坂の隠れ家イタリアン「TREES」で起きた不思議な夜のお話をしようと思います……。 ・ ・ ・ なりちゃん：まこりーぬさん、最近めちゃめちゃLIGブログで取材記事書いてますよね！ 本当にお疲れさまです。 まこりーぬ：ありがとう〜（涙）。何気なくはじめた取材活動だったけど、今後はLIGのマーケティング施策の一貫としてもっといろんな記事コンテンツを作って、「LIGが発信する情報はいいなぁ」と思ってくれるファンを増やしていきたいんだよね。 おじさん：マーケティング施策としてファンを増やす、か…… まこりーぬ＆なりちゃん：！ おじさん：こんばんは。質問
こんにちは、Webデザイナーのまっつーです。 フォトショ(Photoshop)のスーパー解像度の使い方について、実際の画像をお見せしながらわかりやすく紹介していきます。 この記事を読めば「提供された画像の画質が悪い…」「古い写真を使いたいが画質が悪い…」といった悩みが解決できます。 Photoshopのスーパー解像度とは 「スーパー解像度」とは一言でいうと、AIの技術で画像の解像度（画質）を格段にあげることできる機能です。 2021年Adobe Camera Raw v.13.2に追加された新しい機能で、Adobe Senseiという人工知能のAIが細部を自動的に補完し鮮明な画像に処理してくれます。（似ている機能で「ディテールを保持2.0」というものがありますが、期待できる効果は「スーパー解像度」の方が高くなります。） この機能を使うと画像の解像度は縦横それぞれ2倍のサイズになり、全体の解
「写真ポートフォリオサイト」をささっと作りたいときに便利な無料テーマ＆無料プラグインまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、ハルです。 趣味で写真を撮ることが多くなりました。休日に人物を撮ったり、風景を撮ったりしています。とても楽しいです。 エンジニアですが、フォトショップの知識はWebサイト制作をしていることもあってある程度あり、Lightroomも意外とすんなり使えました。RAW現像、楽しいですね。 SNSでシェアするのが楽しかったのですが、あとから見返すのがいまひとつ不便で……。そこで、Webサイトに公開したらもっと便利なんじゃないかーと思いました。 今回は、ポートフォリオサイトをコードを書かないで作りたいと思います。WordPressの無料テーマとプラグインのうち、どんなものを利用すればよいポートフォリオサイトが作れるかご紹介します。 おすすめプラグイン 個人的にこのプラグインがあれば、見た目的にも問題ないのではというものを紹介します。 EWWW Image Optimizer https:
続いてそれぞれのユースケースについて、具体的な使い方を解説します。 Figmaの使い方・操作方法 デザインをもとにコーディングする場合 ‐ Dev mode Dev modeの利用がおすすめです。現在ベータ版で公開されており、2024年中に有料プランのみ使用可能となります。 主な機能として、作成したデザインをもとにコードを自動で生成させることができます。CSS、iOSのSwiftUI、AndroidのXMLなどに対応しています。 具体的な使い方は次のとおりです。今回はログイン画面を例にしています。 画面をセクションで囲む セクション名の右横のコードアイコンをクリック Open in Dev modeでDev modeに切り替える コード化したいコンポーネントを選択すると、右側のInspectでコードを参照できる ワイヤーフレームを作成する場合 ‐ コンポーネント機能 コンポーネント機能を利
ランディングページの作り方｜成果を出すための重要ポイント5選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、マーケターのまこりーぬです。 サービスや商品の魅力を余すところなく伝え、顧客の獲得を目指すためのランディングページの作成は、より多くの顧客を獲得したいと考えている会社にとって急務であるといえます。……しかし、より多くの顧客を獲得するランディングページを作るためにはコツが必要です！ この記事では、そもそもランディングページとはなにか、その構成と作り方のポイント、作成する際のポイントまで、まるっと解説いたします。 ランディングページとは ランディングページとは、広告からアクセスしてきたユーザーに対し、サービスや商品の魅力を余すところなく伝え、サービスや商品の購入を促すためのWebページです。公式サイトは複数のページで構成されているのに対して、ランディングページは主に、1ページ完結型となっています。 公式サイトとは別にランディングページを作る理由としては、次の3つが挙げられます。 タ
17個のWebサイトから学ぶ、デザインクオリティを上げる6つのポイント | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
おはようございます、こんにちは、こんばんは、デザイナーのまべです。 今回は普段Webサイトを見ているなかでグッとくるデザインのポイントを、クオリティを上げるヒントとしてまとめました。 もちろん見るだけでなく実際に制作のなかで実践してきたことを改めて言語化したので、何か物足りない、もう一段階クオリティを上げたいと思っている方に読んでいただけると嬉しいです。 ファーストコンタクトにストーリーをつける ユーザーはWebサイトに初めて訪れたときの接点で、サイトに対して抱く印象がほぼ決まると言っても過言ではないです。巧みなグラフィックは興味を引きますし、ジェネラティブなアニメーションはスタイリッシュな印象や、技術的なイメージを抱くでしょう。 多くのユーザーは情報を取得したい、という動機がありますが、コンセプトからサイトへの来訪、そしてコンバージョンへのストーリーを作り、情報と演出を違和感なく繋げてい
こんにちは、デザイナーのまいまいです。 突然ですが、みなさんのPhotoshop、大丈夫ですか？ 書き出しにありえない時間がかかったり、そもそも開くことが困難だったり、重すぎて落ちたり……重すぎて落ちたり！！！！！！！ Photoshopは、人と共有したりすることも多く、次に使う人のことを考えないといけませんよね……ね？ 重すぎてPhotoshopでの作業時間よりも、回り続けるレインボーを眺めている時間の方が長い……なんてことになったら、共有した人に1週間は強めに恨まれると思います。 なので、人伝や公式ホームページなどでいろいろ調べてきました。そのなかでも「これはよかったなあ」と思った対処法をみなさんにも共有しますね。 独学でつまずいていませんか？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。どんなス
2020年版、Node.js入門！使い方〜環境構築までを丁寧に解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、LIG Philippines Inc.のセイトです。 先日久しぶりにNode.jsを書く機会があったんですが、PCを変えたばかりだったので環境構築から始めました。 そして、速攻ハマりました。 あれ、うまくいかねえぞ……と。 調べてわかりましたが、結論、2019年のMac新OSであるCatalinaにおいては、従来のやり方では十分なNode.js環境を構築できません。 そして、これについて書いてある情報を少なくとも僕は見つけられませんでした。 というわけで、Node.jsを書きたいみなさん、おまたせしました。 2020年版、Node.js入門！使い方〜環境構築までを丁寧に解説します。 知識ゼロの方にもわかるよう進めていきたいと思います。 ちなみに、この記事と同じ内容をYouTubeでも解説しています。動画で勉強したい方はぜひこっちを観てね！ Node.jsとは？ そもそもNod
新卒未経験Webディレクター向けに作ったマニュアルをチラ見せします | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
と、声をかけていただけることがしばしばありました。 はて？ 何の資料だろう？ と不思議に思っていたのですが、実は休職前に新卒ディレクターに教えるためにまとめていた資料が脈々と受け継がれていたのでした。 なんとも嬉しい声！ 正直、頑張って作った甲斐あった！ 今回は、新卒・新人ディレクターに向けて作ったマニュアルの一部を抜粋して、チラ見せしたいと思います。 ※ 以下の内容はOJTをしていきながら「わからない」と返答されたものを基準にまとめておりますので偏りがあります。一例としてお考えください。 マニュアルの構成 マニュアルの構成は大きく4つに分類されており、それぞれに関係した知識をつけることが大事だと考えています。そのため、マニュアルを作り始めるときには以下の扉ページを作るところから始めました。 資料の扉ページ ディレクション デザイン コーディング システム 1. ディレクションで必要な知識
「そのメルマガ、やり方間違ってます！」配配メール安藤氏に聞く・メールマーケティングできちんと成果を出す方法って？ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
みなさんこんにちは、マーケターのまこりーぬ（@makosaito214）です。 マーケターの大先輩取材シリーズもなんと8回目を迎えました。いつも本当にありがとうございます！！！ 今回貴重なお時間をいただいたのは、メールマーケティングといえばこの方！ メール配信システム「配配メール（ハイハイメール）」総責任者の安藤さん（@comune1128）です！！！ 株式会社ラクス MC事業部 部長 安藤 健作 さん大学卒業後、アパレル企業勤務を経て2006年ラクス入社。同社でサポートチームを組織化したのち、マーケティングマネージャーを経て2016年よりMC事業部長/Mail Marketing Lab総責任者。正しいメールマーケティングを日本に根付かせるため、さまざまなメディアやTwitterにて日々情報発信中。 まさに前職の私がそうだったのですが……メール配信って、なんとなく存在する通説のもと、とく
こんにちは、エンジニアのづやです。 ありがたいことに、この業界で15年程度生き抜くことができまして、質問を受けたりレビューをしたりする機会が多くなってまいりました。 しょっちゅう必要ではないのですが、カスタマイズが必要になった際に解決したことを今回まとめてみました。 非公開ページを親ページにしたい 皆様はWordPressをGutenberg（グーテンベルク）で使われているでしょうか。 URLを綺麗にしたいときなど、固定ページで非公開の親ページを選びたいときがありますよね。 page_attributes_dropdown_pages_argsとかquick_edit_dropdown_pages_argsにフックしてたと思うのですが、グーテンベルクになってからは、ここもrest apiで取得しているようで効かなくなってますよね。 add_filter( 'rest_page_query'
React Three Fiberでシンプルなパーティクルアニメーションを実装してみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。フロントエンドエンジニアになりたてのぼこです（ついに2年目になってしまいましたが気持ち的には「なりたて」です）。 今回は、前回の記事で紹介したReact Three Fiberを使って、もう少し具体的な表現をしてみようということでパーティクルアニメーションの実装をしてみました。Webサイトのクリエイティブ表現といえばまずはパーティクル、みたいなとこありますよね（？） コードの量は少なめにシンプルな演出にしたので、React Three Fiberを始めたての人にも参考になると嬉しいです。
「マーケティングやりたい人」がマーケターに向いていない理由とは？ディノス・セシール石川氏＆WACUL垣内氏が世のマーケター像をぶった斬る！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
そこで記念すべき10記事目は、おなじみWACUL垣内勇威さん（@yuikakiuchi）と、その垣内さんが「この人は本当にすごい！」と太鼓判を押すディノス・セシールCECOの石川森生さんに取材の機会をいただきました！ BtoBからBtoC、大手からベンチャーとさまざまな企業におけるマーケティングを経験・支援されているお二人に、全マーケターが気になるテーマである「マーケターのキャリア」についてお話をうかがうことに。いったいどんな切れ味鋭い言葉が飛び出てくるのでしょうか……！（震） マーケターとしてスキルアップしたいみなさま、これからマーケターを目指すみなさま、心してご一読ください！ 株式会社ディノス・セシール CECO 石川森生 さん1984年生まれ。SBIホールディングス入社後、SBIナビ（現ナビプラス）の立ち上げ。その後、ファッション通販・マガシークでマーケティング責任者として、サイトリ
WordPressのバージョン5.5.0から追加されたXMLサイトマップ自動出力機能を紹介 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
WordPress5.5.0から追加された新しい機能についてご紹介します。 この記事を執筆中のWordPressの最新バージョンは5.8.2なので、なんで今更と思われてしまうかもしれませんが、少し驚いた機能だったのでこうして記事にしてしまいました。 WordPressはXMLサイトマップを標準で出力する？ しない？ これまでWordPressではXMLサイトマップはそのままでは出力されませんでしたので、プラグインを利用したり、または自前で用意したりといったかたちで対応をしてきたと思います。あるとき、WordPressをいじっているとまだ準備していないはずのXMLサイトマップが出力されていることに気づきました。 WordPress5.5からはデフォルトでXMLサイトマップが出力されるようになっていたのです。それがどのような機能なのかを簡単に見ていきたいと思います。 XMLサイトマップには、設
本記事に関しまして 今回弊社が企画制作し2021年9月28日付けに公開したPR記事に関しまして、不適切な表現があり読者のみなさま、ならびに関係者のみなさまにも不快な思いをさせてしまい、心よりお詫び申し上げます。 該当記事は30日午前に掲載を取り下げました。 お客様のサービスを魅力的に伝える立場にありながら、ハラスメントと捉えられるような表現を含む記事コンテンツを企画制作し、公開してしまいましたことを深く反省しております。みなさまからのご指摘のとおり、情報発信をおこなうメディアとして軽率な行動・判断であったと関係者一同、この事態を非常に重く受け止めております。 また、弊社が企画制作したコンテンツにご協力いただいた広告主のみなさま、ならびに出演者のみなさまに対して、誤解ある印象を与える結果となってしまったことを、誠に申し訳なく感じております。日頃から弊社とお取り引きしてくださっているお客様に対
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザイン思考とは？フレームワークの5つのプロセスを解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Claude 3とGPT-4のコーディング性能を比較！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
【実例付き】Photoshop(フォトショ)のスーパー解像度の使い方・注意点| 株式会社LIG
エンジニア向けFigmaの使い方を徹底解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Photoshopが重いときの対処法7選【決定版】 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
たまに役に立つWordPressのカスタマイズ5選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
本記事に関しまして | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作