タグ

2015年10月7日のブックマーク (11件)

  • Access another computer with Chrome Remote Desktop - Computer - Google Chrome Help

    You can use a computer or mobile device to access files and applications on another computer with Chrome Remote Desktop. On your computer, Chrome Remote Desktop is available on the web. To use your mobile device for remote access, download the Chrome Remote Desktop app. Tip: As an administrator, you control user access with Chrome Remote Desktop. Learn how to control use of Chrome Remote Desktop.

    site159
    site159 2015/10/07
    期限切れのホストを更新する 「[HOSTNAME] の Chrome リモート デスクトップは最新ではないため、更新する必要があります」という通知が表示された場合は、Chrome リモート デスクトップ ホスト ソフトウェアの新しいバージョ
  • 必ず使うタスクランナーGulpとGruntの基本コード9選 - ICS MEDIA

    みなさんはタスクランナーを使用していますか? タスクランナーとは開発作業を自動化するためのツールで、2013年頃からWebのフロントエンド開発のトレンドとなっています。開発の現場では主にオープンソースのGulp(ガルプ)とGrunt(グラント)がよく使われています。 記事ではGulpとGruntの両方の導入方法とウェブ制作でよく使用するプラグインの使い方を紹介します。GulpとGruntのいずれかはすでにインストールしているとして紹介します(記事末尾で付録としてインストール方法を解説しています)。 ※GruntとGulpの違いを知りたい方は記事「絶対つまずかないGulp入門」を参考ください。 この記事は2018年12月にリリースされたGulp 4に対応しています ファイルの複製 作業用のフォルダーからリリース用のフォルダーへファイルをコピーしたい時などに複製するタスクを登録しておくと便利

    必ず使うタスクランナーGulpとGruntの基本コード9選 - ICS MEDIA
  • CSS3のブレンドモードが素敵! 新プロパティmix-blend-modeを使いこなそう – ICS MEDIA

    mix-blend-modeというCSSのプロパティ。これはDOM要素を重ねた時の見え方を指定するCSSプロパティです。デザイナー視点だとブレンドモードはごく当たり前に使う機能のひとつ。mix-blend-modeはウェブの表現手法が広がり、デザインの自由度が広がる注目すべきCSSプロパティです。記事はmix-blend-modeの魅力と使い方をデモを交えて紹介します。 そもそもブレンドモードとは? ブレンドモードはクリエイティブな表現を作る上での基機能のひとつです。Adobe PhotoshopやIllustrator、After Effects、XDや、Figmaで搭載されていて、レイヤーを重ねたときにどのように重ねて表示するかの設定になります。ソフトによっては「ブレンドモード」や「描画モード」「モード」と異なる名称が使われていますが、機能としては同じものになります。記事ではCS

    CSS3のブレンドモードが素敵! 新プロパティmix-blend-modeを使いこなそう – ICS MEDIA
  • JenkinsとSeleniumを使ってWebコンテンツの自動UIテスト環境を作ろう! - ICS MEDIA

    先日公開した「UIテストの自動化!Node.jsとSeleniumでWebアプリのUIテスト環境構築」では、手動で行っていたWebアプリのUIテストをSeleniumを使って自動化する手法についてご説明しました。 SeleniumでUIテストを自動化することにより、リグレッションテスト(改修により既存機能への影響がないかを確認する回帰テスト)が簡単にでき、バグの早期発見に繋げることができますが、実際にはこのテストを運用でしっかりと行っていかないとプロジェクトとしての品質向上にはつながりません。また、コマンドラインの扱いに慣れていない方は、コマンドラインからのテストの実行に抵抗があり、テスト結果もコンソールに出力されるため見づらいと思う方も多いと思います。 そこで今回はCI(継続的インテグレーション)ツールであるJenkinsとSeleniumを連携することで、定期的にテストを実行し、テスト

    JenkinsとSeleniumを使ってWebコンテンツの自動UIテスト環境を作ろう! - ICS MEDIA
  • WebエンジニアのためのSwift言語入門 - ICS MEDIA

    MaciPhoneiPad、そしてApple Watch。これらのApple製品上で動くアプリはObjective-CとSwiftという言語で開発できます。Swiftは2014年に発表され、他のプログラミング言語の長所を多く取り入れたプログラミング言語です。何かしらのプログラミングの経験がある開発者にはもちろん、これからプログラミングを始める人にも比較的学習しやすいものとなっています。今回はiOSアプリにおけるパーティクル表現を通して、ActionScript 3.0やJavaScriptのようなウェブ開発技術と比較しながらSwiftを始めてみましょう。 デモについて Swiftで作られたパーティクルアニメーションをiPhone 6 Plus上で動かすデモです。画面上でフリックした場所にパーティクルが発生し、時間の経過とともに色が変わっていきます。 ソースコードはGitHubで公開して

    WebエンジニアのためのSwift言語入門 - ICS MEDIA
  • UIテストの自動化!Node.jsとSeleniumでWebアプリのUIテスト環境構築 – ICS MEDIA

    Webアプリケーションを開発する際、みなさんはどのようにテストを行っていますか? Webアプリケーションは、ユーザーごとに異なるブラウザを使用しており、ユーザー操作も必要となるため、手作業でテストをされている方も多いと思います。また、機能改修やバグフィクス後に、リグレッションテスト(改修により既存機能への影響がないかを確認する回帰テスト)が必要となりますが、時間が取れずしっかりとテストができていない方も多いのではないでしょうか。 記事では、これらのテストを自動化することのできる「Selenium Webdriver」(セレニウム ウェブドライバー)について紹介します。 入力フォームのバリデーション機能をチェックするデモ 簡単な入力フォームのバリデーション機能をチェックするデモを動画で紹介しましょう。入力値に対して期待するエラー文言が表示されているかのテストを実施しています。Seleniu

    UIテストの自動化!Node.jsとSeleniumでWebアプリのUIテスト環境構築 – ICS MEDIA
  • PreloadJSで「悩ませないローディング」の作り方―CreateJS勉強会 - ICS MEDIA

    先日行われたCreateJS勉強会 (第5回)にてPreloadJSで「悩ませないローディング」の作り方というテーマでライトニングトークさせていただきました。時間の関係でお伝えできなかった部分も含め記事でまとめました。みなさまのローディング作りのご参考になれば幸いです。 PreloadJSとは? PreloadJSとは、CreateJSのライブラリモジュールの1つで外部ファイル(画像・音声・JSONなど)の読み込み処理を担当しています。読み込み状況をイベントで監視して読み込み率(0.0〜1.0)を取得できます。その読み込み率を演出用のJavaScriptに渡してあげることで、読み込み状況に合わせた演出を実現できます。 ソースコード PreloadJSで外部ファイルを読み込むソースコードです。今回はLoadQueueクラスを使って拡張子の違うファイルをまとめて読み込んでいますが、同じ勉強会

    PreloadJSで「悩ませないローディング」の作り方―CreateJS勉強会 - ICS MEDIA
  • APNG Assembler

    Download APNG Assembler Browse all files Forum GUI version: Command-line version: Related projects: apngdis: APNG Disassembler gif2apng: GIF -> APNG converter apng2gif: APNG -> GIF converter apngopt: APNG Optimizer APNG Assembler creates APNG animation from PNG/TGA image sequence. A number of optimization techniques used to make APNG files as small as possible: inter-frame optimization utilizing a

    site159
    site159 2015/10/07
    APNGの生成アプリ
  • ウェブ用アニメーションを劣化なく保存できる画像形式APNGの作り方 – ICS MEDIA

    APNGエーピング(Animated Portable Network Graphics)形式とは、高画質なアニメーション用の画像形式です。類似の画像形式としてGIFアニメーション形式が存在しますが、APNGは高画質化が可能であり透過情報の扱いに長けています。詳しい利点は記事「これからはGIFアニメからAPNGの時代に」で紹介しています。 記事ではAPNGファイルの作り方を解説します。APNGファイルの作り方はいろいろありますが、「できるだけデータ容量を軽く」というテーマでまとめてました。 ※LINEアニメーションスタンプの作り方については、記事「LINEのアニメーションスタンプはこう作る! APNGファイルの作り方を徹底解説」で解説してます。 APNGの作り方の手順 記事では次の手順で解説します。 Adobe Animateでアニメーションを作成 アニメーションの連番画像を書き出し

    ウェブ用アニメーションを劣化なく保存できる画像形式APNGの作り方 – ICS MEDIA
    site159
    site159 2015/10/07
    APNGの吐き出しかた
  • 絶対つまずかないGulp入門。インストールからSassのコンパイルまで – ICS MEDIA

    ウェブサイト制作には煩雑な処理を自動化する「タスクランナー」や「ビルドシステム」というツールがあります。この記事では、タスクランナー「Gulp.jsガルプ」の導入手順を解説します。 導入は簡単で、記事の手順では5分程度でセットアップできます。Gulpはコマンドラインで使うのが一般的ですが苦手な人でも安心して学べるよう、ビデオでも解説します。 この記事で学べること イマドキのGulpの導入手順 Gulp 5に対応した書き方 Sassサスの導入手順 GulpやSassの導入や使い方にはいろんな方法がありますが、この記事では現場で使われている方法を紹介します。Gulpの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。記事は最新版に対応させているので、安心して読み進めてください。 ※この記事では、Node.js v18〜v20で動作検証をしています。 ※Gulp

    絶対つまずかないGulp入門。インストールからSassのコンパイルまで – ICS MEDIA
  • JenkinsでCI環境構築チュートリアル (Windows編) - ICS MEDIA

    CI環境のサンプルとして前回、記事「作業の効率化のためのCI環境構築」を紹介しました。この記事を公開したところ、環境構築の仕方を知りたいとの要望を多数の読者から頂きましたので、複数回の記事に分けて説明したいと思います。 Jenkinsを利用されている方は、LinuxmacOSで利用されている方が多いと思いますが、記事ではサーバが苦手な人でも導入できるよう、「Windows環境を使ったCI環境構築」をテーマとして手順を説明します。 1。ソフトウェアのインストール 環境構築に必要なソフトウェアをインストールしましょう。必要となるソフトウェアは以下になります。 Jenkins 2.7.2(http://jenkins-ci.org/) git for windows 2.9.3(http://msysgit.github.io/) WinSCP 5.9.1(http://winscp.net

    JenkinsでCI環境構築チュートリアル (Windows編) - ICS MEDIA