アニメーションに便利なJavaScriptライブラリTweenMaxを使ってみる（その1） | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、CTOのづやです。 今日はアニメーションさせるときに便利なTweenMaxの使い方について書きたいと思います。 こちらのスピードテストのページを見るとわかるように、かなりハイパフォーマンスなアニメーションが可能です。 というわけで、基本的な使い方を書いていきたいと思います。 とりあえず要素を動かしてみよう まずは公式ページからダウンロードしましょう。 慣れないうちはTweenMax.jsを、とりあえず以下のように読み込んでおきましょう。 <script src="js/TweenMax.min.js"></script> 基本的によく使うクラスとして、以下の4つがあります。 TweenLite TweenMax TimelineLite TimelineMax Tween系とTImelite系の2種類がありまして、それぞれMaxが高機能版だと考えてよいかと思います。 単純に要素
CSS3のFlexboxを基本から理解して、使い方をマスターしよう！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、王です。デザイナーやってます。 今回は「Flexboxを基本から理解して、使い方をマスターしよう！」ということで、初耳の方でもざっとFlexboxで何ができるか分かるように短い動画を用意しました。 動画の中で使ってたデモをアップしたので、確認してみたい方は以下のリンクをどうぞ！ デモ 昨今では、当然ながらデジタルデバイスサイズの多様化でレスポンシブデザインとやらが流行っています。 同じサイトをさまざまなスクリーンサイズに応じたデザインをしなければならない上に、コーディングにも手間がかかります。制作側からしたら何かと厄介ですよね。 「なるべく手間をかけずに作りたい！」という世界中のデザイナーの声に応えて、「Twitter Bootstrap」をはじめとした数多くのフレームワークが徐々に脚光を浴びはじめて久しくなります。 ただ、これらはあくまで古い技術の組み合わせで、革新的な技術で
無料SSL / TLSサーバー証明書「Let's Encrypt」を知っていますか？ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、エリカです。 「Let's Encrypt」という、無料で利用できる SSL / TLS サーバー証明書があることはご存知でしょうか？ エンジニアのあいだでは以前から知られていたようなのですが、「複雑そう……」と思って敬遠していたところ、SAKURA サーバーが導入した ことを知って、調べてみることにしました。 ※ SSL / TLS サーバー証明書の導入理由については、むむの記事を参考にしてください。 なぜ「Let's Encrypt」は無料で利用できるのか それは、Internet Security Research Group (ISRG) という公益法人が無料で提供しているからです！ 素晴らしいですね。 ISRG は「誰もが安全なウェブを体験できる」ことを目的にとした公益法人で、Mozilla、Chrome、Facebookほか、さまざまなスポンサー の寄付で運営されて
初心者が1日で恋愛ゲームアプリを開発してみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
人物紹介：さんぺー エディター。フロントエンドエンジニア連載の編集担当なのに、プログラミングの知識がなくてつらい。 プログラミングなんて全然できないんですけど、もしできるようになったら、アプリを作りたいんです。なぜなら！ ワンチャン大儲けできるから……！ でも、プログラミングスキルは一朝一夕で身につけられるほど簡単なものではありません。こんな無知な状態では、アプリ開発なんて夢のまた夢………… でもなかった！ ジャジャン！ こちら、私が作った恋愛ゲームアプリです。初心者にしてはまあまあじゃないでしょうか？ 恋愛×ゲーム×美少女で、お金になりそうな要素を詰め込んでみました。 しかもこれ、わずか1日足らずで開発したものなんです。私みたいな超初心者がどうしてアプリ開発をできるようになったのか、その全容をお伝えします。 動画学習サイト「Udemy」でアプリ開発を学ぶ アプリの作り方を教えてくれたのは
敬語でビジネスメールを書こう！よく使う言い回し・よくある間違いをまとめました。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。社会人歴10年の九州ライター村上です。 さてみなさん、敬語って難しいですよね。まず謙譲語と丁寧語の違いがよくわからないし、頑張って丁寧に言ったら「それ二重敬語だから」とか言われてショボーンとする。新入社員さんたちは細かく先輩にチェックされて、接客対応自体が怖くなる時期なのではないでしょうか。 そんな若手社員のために、メールにファイルを添付するときのビジネスマナーとおすすめファイル送信サービスや、間違えやすいビジネス敬語の実例50選【模範解答付き】も合わせてご紹介しています。 今回は敬語を使ったビジネスメールについてまとめました。 【編集部からのお知らせ】 学び直しに興味があるみなさんへ。 何を学ぼうか迷っている方におすすめなのが「Webクリエイター」です。 Webクリエイターをはじめとしたデジタルマーケティングの領域は人気・需要が高くなっています。 スクールで体系的に学んで、未
【保存版】10分でわかるWebマーケティング手法の全施策まとめ【図解付き】 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
はじめまして。ソウルドアウト株式会社のなごと申します。 「Web上でユーザを集めるための施策をすべて答えてください！」と言われたときに、パッと答えられる方は少ないのではないでしょうか？ Webマーケティングとひと口に言っても、その全体像を具体的にイメージできる人は少ないものです。本気で成果をあげたいと思ったら、まずはWebマーケティング全体を俯瞰した上で、施策を組み立てていくことが重要です。 今回は、一目でわかるようにWebマーケティングの全体像を1枚の画像にまとめました。また、それぞれの具体施策の概要やコスト感、即効性をわかりやすくざっくりとご紹介します。 マーケティングとWebマーケティングの違い まず前提として、マーケティングの中でも「Webマーケティング」の特徴について整理します。 Webマーケティングには以下のような特徴があります。 効果測定性 ハイスピード ローコスト パーソナ
EFO（エントリーフォーム最適化）でお問い合わせのCVRを爆上げするグロースハック | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、エディターのエリーです。 みなさん、エントリーフォームを最適化できていますか？ わたしが前職でポイントサイトのディレクションをしていた頃、会員獲得のためにエントリーフォームをよく改修していました。 出口の見えない洞窟のようで、結局最後まで答えが見えませんでしたが、今ならもっと健闘できそうです。 なぜなら、EFOでCVRを爆上げするためのグロースハックを、EFOに関するノウハウが豊富なショーケース・ティービーさんにお聞きしたから！ 今回はそのノウハウをみなさんに共有したいと思います。 ▼もくじ EFO（エントリーフォーム最適化）とは？ よくあるエントリーフォームの失敗 1. 送信が完了できない 2. エラーが出ても、間違いの箇所がわからない 3. エラーの度に再入力が必要な項目が多い 4. 誤った操作で入力がクリアされる 5. マイナーブラウザで動作しない or 文字化けする 6
Webサイト制作に使えるおしゃれな無料アイコンサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーのモモコです。 Webサイト制作をする上で欠かせないアイコン素材。デザイン性にこだわりたくても、「一からデザインしている時間がない！」という方もいますよね。 そこで今回は、数あるアイコン素材の中から、デザイン性に優れたおしゃれな無料アイコンを厳選してご紹介します。 線で構成されたライン系アイコンやシンプルなフラットデザイン、手書き風のアイコンなどをテーマ別に紹介しているので、これから制作するWebサイトの雰囲気に合わせてご活用ください。 なお、今回は基本的にロイヤリティフリーで使用できるものを集めましたが、ご利用になる際は各配布先にて利用許諾範囲を必ずご確認ください。 ※この記事は、2015年に公開されたものを最新情報を踏まえて編集部で再編成しました。 シンプル・フラットなデザインがおしゃれな無料のラインアイコン Streamline https://www.stre
スマホサイト構築に便利なドロワーメニュー・スワイプのjQueryプラグインまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのはるえです。 もうほとんどの案件でPC＋スマホ制作がセットになってきましたね。 LIGに入社したての1年前まではスマホの制作経験を聞かれてうつむき気味だった私も、おかげさまで今じゃスマホサイトを喜んで作るようになりました。 ありがとうございます！！ そこで今回は、スマホサイトで使われやすいドロワーメニューやスワイプ実装の際に必要となるプラグインをご紹介させていただきます。 【こちらもおすすめ】 ☞ 高機能なJavaScriptの人気スライダープラグイン4つを実際に使ってレビューしてみた Facebookでもおなじみのドロワーメニュー3選 今じゃ基本中の基本となっているドロワーメニュー。 Facebookなどで使われている、横からぬるっと出てぬるっと引っ込むあれです。動きが気持ちよくて、実装も簡単にできるものを中心にまとめてみました。 jQuery slimMenu
美しいWebデザインをタイプ別に！見ないと損するパーツ別ギャラリーサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
中型ライダー（二輪）免許を持っているライターの内藤です。 本日は、ライダーキック並みの強烈さで役に立つ見本サイトをまとめてみたいと思います。 Web屋さんはご存じの方も多いかもしれませんが、ブログをしている一般の方、Webデザイン・DTPに興味のある方、お店を持っている方なども必見です！ 部品に特化した見本 部品に特化した見本サイトをご紹介します。 見出しデザイン（h1,h2,h3……その他DTPでも） はじめは見出しデザインに特化した見本サイトまとめ。 見出しデザイン.com http://midashi-design.com/ 見出しタグ（h1,h2,h3……）のデザインの見本ですが、DTPなどでもヒントになるものがたくさんあります。 カテゴライズは、グラデーション・テキストのみ・テキスト非画像・上線・下線・丸・四角・囲み線・斜線・点線・角丸。 ヘッダー部分に凝っても見出しが適当だと全
フォームを劇的に使いやすくする！HTML５の８つの新属性 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、はやちです。 以前の記事初めてHTML5でコーディングする時のまとめでは、html5の新しい要素を紹介しましたが、今回はフォームのinput要素に追加された属性をご紹介します。これらを使えば、今まではJavascriptで実装していたような動きをHTMLだけで実現する事が出来ます。 ※ 2012.07.11 Twitterでご指摘をいただき、タイトルの”８つの新要素”を”８つの新属性”に変更いたいました。また、内容の方も修正致しました。 autofocus属性 この属性を指定してあげる事により、ページがロードされたタイミングで自動的にフォーカスがあたるようになります。例えば検索ボックスなどに指定してあげたり、メールフォームの一番上の要素にこれを指定してあげれば、ユーザビリティが上がると思います。 html <form> <label>お名前: <input type="text
投稿画面がすごく便利になる！WordPressプラグイン4選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちわ段田です。 今回もWordPressプラグインにスポットをあてたいと思います。 今回は管理画面の投稿画面で役立つプラグインをテーマに紹介します。 1.Parent Category Togglerプラグイン 通常、投稿画面ではカテゴリ項目で子のカテゴリにチェックした場合、画像のように親のカテゴリには自動的にチェックが入りません。 Parent Category Togglerプラグインは自動で親のカテゴリにチェックしてくれます。プラグインインストール後、子カテゴリにチェックすると、自動的に親のカテゴリにもチェックを入れてくれます。 便利！ Parent Category Toggler 2.Save Editor Scroll Positionプラグイン 投稿を保存した時、エディタのスクロールは一番上に移動してしまいます。このスクロールの位置をそのまま動かさないようにするプラグイ
背景画像のフリー素材サイト10選！デザインで悩んだときに役立ちます | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
1. Subtle Patternsオススメ https://www.toptal.com/designers/subtlepatterns/ 一番よく利用してます。商用利用可の、シンプルで使いやすいシームレスの画像がたくさんあります。 2. Background Labs http://backgroundlabs.com/ 色・タグから検索できます。花柄やイラストがはいった、カラフルで派手なパターンの画像やイラストが多いです。 3. pattern cooler https://www.patterncooler.com/ 選んだデザインの柄の大きさや色をカスタマイズできます。派手派手なデザインがほとんどなので使いどころは難しかもしれません。 4. TextureKing https://www.textureking.com/ テクスチャ画像をお探しのときはこちら。木目・コンクリート
情報を効率よく手に入れよう！キュレーションサイトをまとめてみた！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
遠藤要さんと、エハラマサヒロさんの間に立って写真を撮りたい。よく似てるって言われます。野上です。 突然ですが、皆様はキュレーションサービスを利用していますか？ キュレーションという言葉、ご存知の方もいらっしゃると思いますが、簡単に復習しておきましょう。 キュレーション……人手で情報やコンテンツを収集・整理し、それによって新たな価値や意味を付与して共有すること。Web上でキュレーションによるコンテンツの価値を提供するサービスは、キュレーションサービスなどと呼ばれている。 【参考元：IT用語辞典BINARY】 話題になった、パーソナルマガジン「Gunosy」もキュレーションサービスの1つです。 独自のアルゴリズムを利用し、ネット上で話題になっている情報やコンテンツを、ユーザーが得たいジャンルに合わせて配信してくれます。すごく便利ですよね。今回はそんな便利なキュレーションサービスについてまとめて
便利ツール「Clibor」でコピペ作業を10倍楽にする方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 「クリップボードに複数のキーワードを記憶できたらなあ」 “コピー＆ペースト”を使う上で、こんなことを思ったりはしませんか？ ・・・思いますよね？ね？ね？ 今回ご紹介するフリーソフト「Clibor」を使えばその夢が叶います！ 例えば 「メールや日報など、毎日の定型文を書く作業の効率アップ」 「うっかり、ctrl+vとctrl+cを間違えて押してしまった時のダメージを軽減」 こういった際に役に経つのが、フリーソフト「Clibor」です！ まずは以下のURLからDLし、「Clibor」を起動させてみてください。 （※寄付金を募っていますが、無料で使用することができます。ちなみに、現在はWindowsにしか対応していないようです。） Cliborのダウンロードはこちら： https://www.vector.c
Web業界では定番！おすすめのIT系ニュースまとめサイト14選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。ディレクターの允（まこと）です。 いつになったら（）がとれるかは謎ですが、今期は続けて行きたい所存です。 允の読み方 よく充（みつる）と間違われますが、 正しくは允（まこと）です。鍋蓋はありません。 最近メディアサイトのディレクションをさせていただく機会が多いので、参考で探したIT系のニュースサイトをまとめてみました。 IT系ニュースサイトまとめ GIZMODO http://www.gizmodo.jp/ 言わずと知れたIT系ニュースサイト。 Apple新製品販売前とかはサイト内がお祭り騒ぎです。面白いので新しいiPhoneが出るときは必見です！ Gigazine http://gigazine.net/ 日々のあらゆるシーンで役立つ情報を提供するIT系ニュースサイト。 こちらのサイトは影響力が非常に強く、制作したサイトなどがGigazineさんにとりあげられると、かなりの確
Web屋ならチェックしておきたい！作業効率が激変するChrome DevToolsの便利な使い方まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Web屋ならチェックしておきたい！作業効率が激変するChrome DevToolsの便利な使い方まとめ こんにちは、デザイナーの王です。 今回の記事では、ChromeのDevTools（デベロッパーツール）について、「多分、周知されていないけど、使わないともったいない！」的な機能を紹介させて頂きたいと思います。 フロントエンジニアにも、デザイナーにも、きっと効率アップに繋がる小技が見つかるはずです。 開発者なら「Chrome Canary」を使おう！ みなさんはChrome Canaryを使っているんでしょうか？一般向けにリリースされている安定版であるChromeより、ほぼ毎日アップデートしている「Canary」ビルトを選ぶ理由があります。 それは、開発者向けの新機能がいち早く利用できるからです！リリースがノロノロしているChromeを使ってたら、いつまでも最新の便利な機能の恩恵が受けられ
コンテンツ作りに役立つ基本的なマーケティング心理学まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
皆さんこんにちは、メディア事業部のそめひこです。 記事や企画作りを行う上で、アイデアやコンセプトがなかなか浮かんでこないことが多々あります。結構な量の記事や企画を組み立てていくので、頭が柔軟ではない自分にとってはアイデアやコンセプトを出していくのは結構な重労働。 そんなときに私が最近参考にしているのが、”心理学”です。 心理学 = 生物体の意識や行動を研究する学問 漠然としたアイデア出しを、心理学を通してより具体的に仕立て上げることで、ある程度の道筋をたてることが出来ます。 アイデア出し役立つ基本的なマーケティング心理学まとめ ■認知的不協和 個人のもつある認知と他の認知との間に不一致・不調和が生じること。その結果、不協和を解消あるいは低減しようとして行動や態度に変化が起こる。 例えばヘビースモーカーの喫煙者に対して、「タバコを吸うとガンになるリスクが高くなり長生き出来ないのでやめなさい」
時代はシェア！プロジェクトの進捗などを共有できるタスク管理ツール12選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ 小学1年生の頃、私のおでこと小学6年生の男の子の前歯がぶつかり、相手の前歯を折ってしまった石頭ライターのうららです。 そんな思い出も、FacebookやTwitterなどのツールでシェアすることが可能になりましたね。 時代はシェアです！ ということで、今回はタスク管理をシェアできるWebサービスをまとめてみました！ ちなみに、ここで紹介するサイトはすべて・・・ オンラインでファイル共有が可能 マルチデバイスに対応 となっております！ すごい！ 3行で紹介するのが流行っているそうなので、そんな感じで紹介していきます！ それではスタート！ 【こちらもおすすめ】 ☞ タスク管理ツール「Trello」をもっと便利にするChrome拡張機能まとめ 完全無料のタスク管理ツール Trello https://trello.com/ 英語にのみ対応 上の写真にある通り、 カードを組み立ててい
コピーライト（Copyright）とは？著作権表示の正しい書き方や意味を解説 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーのサリーです。 サイトをデザインするときに当たり前に入れている「Copyright（コピーライト、©️）」の記述ですが、サイトによって年号があったりなかったり、長かったり短かったり、書き方はさまざまですよね。 今回はコピーライトとは何か、正しい書き方や©との関係性について詳しく解説していきます。 コピーライトとは コピーライトとは、英語で「Copyright」と書き、”著作権”のことを指します。著作権とは、作品を創作した人や会社（著作者）が持つ権利であり、著作者は作品がどう使われるか決めることができます。 Webサイトやホームページの下部にコピーライトがあるのは「ここにある記事や画像の著作権は自社が持っているから、無断転載しないでください」という一種の意思表示です。 厳密にいうと著作権法で著作物は「思想又は感情を創作的に表現したものであって、文芸、学術、美術又は音楽の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
