僕はGIFが大好きです。記事のちょっとしたアクセントに使われていたりインパクト重視で使われていたりと様々ですが、どのGIFも「より読者に伝えたい」という想いが感じられます。 GIFについてなるべく簡単に解説しましたので、GIF初心者の皆さんも是非挑戦してみて下さい！　表現の幅がグッと広がりますよ！ GIF自体の説明などもしているため、必要のない人は目次から飛んでください。 ブログにだけ与えられた力 人は文字よりも画像、画像よりも動画に反応しやすくアフィリエイトなどでの購買率も上がります。 ブログはYoutubeなどの動画サイトと比べ情報量は少なくなります。しかし、だからといって動画の方が優れたメディアというわけではありません。ブログのメリットは手軽さです。また、得たい情報が載っている部分を表示する操作性はブログの方が上です。 ブログは手軽さを武器に他のメディアと戦っていますが、実は一つだけ

観ていると落ち着いたり、こんなところに行きたいなーって、心がほっこりするような写真や風景が好きなヨウコウです。 最近、ブログの記事で使用する写真を検索する際に、ものすごくお世話になってる『Pexels』の使い方を簡単に紹介したいと思います！海外のサイトで英語がたくさんですが、使い方は1分でマスターできます！自分みたいな落ちこぼれ英語難民でも使えます！ 【この記事はこんな人の参考になるよ！】 オシャレな写真を探している人 著作権フリーで使える写真（CC0） Pixabayで満足できなくなってきた人 【読むとこんな嬉しさがある！】 Pexelsの使い方をマスターし、写真検索サイトのストックが増える 質の高い写真に会える確率が上がり、検索時間の短縮ができる 素敵な写真を観て癒される 【目次】 Pexelsとは Pexelsの使い方 １、まずはサイトに行きましょう！ ２、検索ワードを入れましょう！

僕は大学卒業後にIT系企業に就職したが、ブラック企業で精神的に辛くなり辞めた。 クライアントからの狂った納期、無駄な仕様を理不尽に感じながら進める日々から解放されたが、ニートも暇だったので、結局プログラミングは続ける事になった。 ニートになってiOSアプリ開発を初めて2年ぐらいが経つ。 約1年前から2chまとめ系のiOSアプリを開発していて、本格的にネイティブ機能を使って開発したのはこのアプリが初めてである。 昨日(4/23)に、ダウンロード数が突然500倍になるという夢のような出来事が起きた。 ※もちろん、お金を出して広告を出稿したとかではない。 毎日、定期的にダウンロード数やアクティブ数などがわかるfabricという解析ツールをチェックしているのだが、その日は朝から明らかに数字がおかしかった。 たまに数字がバグっていてあとから修正されることもあるので、その日は半信半疑ながら定期的に数字

今回はスレッド式掲示板を作ります。 通常、初心者に教えるサイトってザックリとしたプログラムが書いてあったりして理解できないままの部分が出来てしまったりします。 チェックボックスがあったり、いきなり装飾してあったりと本だと、限られたページ数ですのでそれが顕著です。ちょっとめくったら大規模になっていて諦めたりｗ そこで自分でググりながら解決していく問題集を作りました。 なぜ問題集かというと僕が書くより既に詳しく丁寧なページは沢山あるし、そういった本も沢山出ているからです。 こういった資料にないのは順番だけだと思います。一気に飛びすぎないことが大事かなと思います。ググるということは問題解決に至らなくても他の予備知識が備わるので非常にいい手段です。 あまりにも方向性がおかしくなっても仕方ないので、すこし補足でヒントだけ少し書いておきます。 すべて理解する頃にはTwitter、フェイスブック、Wor

以前に私が書いた「 Dockerの本番運用：失敗の歴史) 」という記事は、非常に多くの反響を呼びました。 その後、長い議論を交わして、何百件ものフィードバックや何千件ものコメントを読み、さまざまな人々や主要事業者とも顔を合わせました。Dockerでの試みが増えるほど、その失敗談は増えていきます。そうした現状を、今回アップデートしておきたいと思います。 この記事では、最近の交流や記事から得た教訓を紹介しますが、その前に簡単におさらいをして軽く背景を説明しましょう。 免責事項：対象読者 たくさんのコメントから、世の中には10種類の人々が存在するということが明らかになりました。 1) アマチュア 実際のユーザがいない試用版のプロジェクトやサイドプロジェクトを実行している人々です。Ubuntuのベータ版を使用するのが当然だと考えており、「安定したもの」は古いものと見なすようなタイプです。 注釈：書

CSSとテキストで実装したローディングアニメーションのサンプルです。 サイズ・カラー・フォントといった見栄えについてはもちろん、アニメーションタイプやスピードを調整したい場合もすべてCSSで変更できるようになっていますし、表示させるテキストもHTMLを書き換えるだけで変更可能なので、手っ取り早くローディングを用意したいときなどに便利です。 ここではアニメーションGIFでの見栄えと実装コードを紹介しているので、実際の表示は以下デモで確認してください。 また、デモではSCSSを利用したコードで実装しているので普段からSCSSで用いてる人はこちらでコードを確認してください。 CODE #1 先頭の「L」からひと文字ずつフェードアウトしていき、末尾の「G」までいったら次は先頭からひと文字ずつフェードインしてくるタイプのもので、フェードイン・アウトの見栄えはopacityを利用しています。 実

2017年4月15日 CSS, 便利ツール 先日公開した記事「CSSグリッドレイアウトで、サイズが違う複数のボックスをタイル状に配置する」に続き、CSSグリッドレイアウト情報第二弾。今回はグリッドレイアウトを作成するにあたり、「Griddy」というCSSコードを生成してくれる便利なWebサイトがあったので紹介します。グリッドレイアウトの勉強にもなると思いますよ！ ↑私が10年以上利用している会計ソフト！ Griddyのサイトを開くと4つのグリッドアイテムが表示されています。アイテムの数を増減するには左上の「Add or Remove elements within the grid」のエリアでプラスまたはマイナスのボタンをクリックして数を変更します。 続いて「Grid Template Columns」でカラムの幅を指定します。デフォルトでは3つのボックスが横並びになっていますが、4つ以上

CSS Gridでは、多くの新しいコンセプトが導入されています。新しいプロパティは17個、新しい用語も数多くあります。これらは今まで使ってきたものとは大きく異なるため、CSS Gridを始めるのを難しく感じさせるかもしれません。 CSS Gridの実装に役立つ基礎知識、コンセプト、主要なプロパティと用語をくわしく解説します。 CSS Grid Layout Terminology, Explained 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 CSS Gridの仕様 「グリッドコンテナ」と「グリッドアイテム」とは 「グリッドライン」とは 「グリッドカラム」「グリッドロウ」「グリッドトラック」とは 「グリッドセル」とは 「グリッドエリア」とは 「グリッド」とは CSS Gridの仕様 CSS Gridの仕様では、グリッドは次

※記事末尾に追記がありますので、そちらもお読みください なぜか無用の長物となっているらしい日本のマイナンバー ちょっと前に facebook のタイムラインを眺めていると、日本の友人たちのうち自由業の人たちが、 「確定申告しないとー。面倒くさい！」 などと書いているのを見たんですが、日本ってまだ「確定申告」というのが存在しているんですか？！　マイナンバー制度が施行されたのに、なんで納税手続きが自動化されていないんだろう……。 ……と疑問に思っていたのですが、どうやら日本ではマイナンバー自体は配布されたものの、まだほとんど実用化されていないみたいですね。とりあえず番号は割り振られたけど、使い道がぜんぜんないのでただの無用の長物になっていると。 なるほど。わたしはマイナンバー制度の施行前にエストニアに来てしまったので、実際の運用がどうなっているのか知らなかったんですよね。エストニアみたいに、日

Gmailの高度な機能「検索演算子」（検索コマンド）を知っていますか？ 名前は取っつきにくそうですが、実は簡単に使えて業務効率をアップできる機能です。最低限覚えておきたい3つの演算子の使い方を紹介しましょう。 PCやスマホで使えるメールアプリとして、すっかり一般的になった「Gmail」。ビジネス向けクラウドサービス「G Suite」（旧：Google Apps for Business）の1つとして、企業のメールアプリとして採用されることも増えています。 そんなGmailの隠れた機能に「検索演算子」（検索コマンド）があるのをご存じですか？ GmailはGoogleのサービスだけあって、パワフルな検索機能が魅力の1つ。何も考えずにキーワードを入力しても該当するメールを表示してくれますが、検索演算子を使えば、より的確に狙ったメールだけを探し出すことが可能になります。 新社会人として職場でGma

レスポンシブWebデザインとは、画面の横幅に応じてWebサイトの表示を変化させ、最適化するデザイン手法です。 レイアウトが「シングルカラム」から「マルチカラム」に変化したり、ナビゲーションメニューが「ハンバーガーメニュー(三←こういうの)」から「横並び」に切り替わったりすることで、スマートフォンから、タブレット・PCまで、画面の横幅に合わせて、Webサイトを最も見易い形で表示します。 そして、そのデザインが変わる境目を「ブレイクポイント」と言います。 ブレイクポイントは、画面のピクセル数（CSSピクセル ※）で表されます。 ※ CSSピクセルについては記事：高解像度ディスプレイとデバイスピクセル比 さて、このブレイクポイントですが、特に、「何ピクセルにすべき」「何箇所設定すべき」といった決まりがありません。 Web制作者も「この辺りに設定すれば大体スマートフォンとタブレットの境目になるので

Googleが中心となって開発しているオープンソースのJavaScriptライブラリ「Angular」のイベント「ng-conf 2017」が、4月5日から3日間、米国ユタ州ソルトレイクシティで開催されました。 3日目の基調講演に登壇したGoogleのエンジニアディレクター Brad Green氏は、TypeScriptがGoogle社内の標準言語に採用されたことを明らかにしました。 この記事では公開されている動画から、基調講演のその部分を中心にダイジェストでまとめました。 2年掛かりでTypeScriptがGoogle社内の標準言語に Brad Green氏。Googleには社内の標準言語（Canonical Languages）としてC/C++、Java、JavaScript、Python、Goが設定されている。 なぜかというと、もし社内のプログラミング言語が15種類もあったら、プロジ

Twitterは米国時間4月6日、データ使用量を抑えた高速版の「Twitter Lite」を発表した。 Twitter Liteはデータ使用量が少なく、低速なワイヤレス接続上での読み込みが高速で、端末上での使用メモリも1Mバイト未満となる。Twitterによると、通常のモバイルサイトよりも読み込みが最大30％高速で、データ使用量は最大70％抑えられるという。ダイレクトメッセージや通知といったTwitter機能にも素早くアクセスできる。 この軽量版Twitterは、アジア太平洋地域、中南米、アフリカといった発展途上の市場での利用にも適しているだろう。こうした市場でも、高速な4G LTEネットワークへのアクセスが普及しつつあるが、低速な2Gや3Gのワイヤレスサービスにしかアクセスできない地域も存在する。米国や欧州などの市場は飽和状態にあるため、ハイテク企業はワイヤレスインフラの整備が進んでいな

Google App EngineでPerlが利用可能になったようです。 Your favorite languages, now on Google App Engine Your favorite languages, libraries and tools (中略) Want to run Perl? Love Elixir? Need to migrate your Parse app? You can do all this and more in App Engine. (太字訳) あなたの好きな言語、ライブラリ、ツールをGoogle App Engineで動かせます。 Perlを動かしたいですか? これらすべてをApp Engineで動かすことができます。 興味のある人は、どんなものか一度チャレンジしてみよう!

ソフトウェアエンジニアの @DQNEO です。こんにちは。 Gitの内部構造を深掘りするシリーズ３回目です。 前回までのお話はこちら Gitのつくりかた – Mercari Engineering Blog Gitのコミットハッシュ値は何を元にどうやって生成されているのか – Mercari Engineering Blog 今日はみんなだいすき「ステージング領域」の中身について解説してみます。 ステージング領域とは何か？ 簡単に説明すると「次にコミットしたときにコンテンツとして登録されるもの」リストです。(別名「インデックス」ともいいます。) このリストは、 git addやgit rmしたときに書き換わります。 (古くはcacheと呼ばれていました。内部実装やgit diff --cachedに今もその名残があります。) git addのマニュアルに説明があります。 Git – git

いつも同じ道ばかりランニングしていませんか？実は私自身、1年前からランニングをしているんですが、走るコースはいつも決まったコースばかり…正直ちょっとマンネリ化していました。ランニングしてる人の中には、私と同じような人がきっといると思うんです。でも、走るコースを変えるにしても、自宅を起点にして方向を少し変えてみるくらいですよね。しかし、今日ご紹介する『Runtrip』を使えば、大胆にランニングコースを好みのものに変更することが可能です。さらに、まるで旅をするようにランニングコースを選ぶことができるので、『あなたのランニングの概念をぶっ壊す』こと間違なしのランニングアプリですよ。本日はそんな『Runtrip』の魅力をサクッとご紹介したいと思います。 ランニングアプリ『Runtrip（ラントリップ）』とは！？ 『Runtrip』はこんな感じのランニングアプリです！ 絞り込み検索を使いこなそう！

This domain may be for sale!

しくみ製作所株式会社 に入社して1年半くらい経った。 別に入退社のタイミングでもないし、時期的にキリがいいわけでもないけど、気持ちや考えていることの整理も兼ねて「会社のこと」と「自分のこと」について書く。 会社のこと どんな会社？ Web アプリケーションや iOS / Android アプリケーションの開発がメインの会社。 受託案件も請けているし、自社サービスもつくっている。 受託案件というとネガティブに捉える人もいるけれど、ありがたいことに、おもしろいお話をいただくことが多い。 弊社の特徴は物理的なオフィスを持っていないこと。 メンバー全員フルリモートワークで、北海道と九州の人が一緒に働いていたりする。離れた場所にいることは普段まったく気にならないけど、ときどきローカルなニュースが Slack に流れてきて楽しい。福島は雪いっぱい積もったよ！東京は暖かいよ！みたいな。 現在は海外を旅し

TomはWalmartやT-mobile、Wells Fargoなどをクライアントに持つデザイン会社、BitoviのUXデザイナー。 デザインについて話すのは簡単なことではありません。デザイナーはステークホルダーに判断の正当性を説明しなければなりませんが、納得させられる力を持ってる人はほとんどいないでしょう。 デザインの決定をわかりやすく説明する能力は、プロジェクトが成功するか否かに密接に関係しています。なぜなら、往々にして一番明確にアイデアを伝えられる人の案が採用されるからです。 実際、一流のデザイナーとそうでない人との違いは、デザインの問題を解決する能力だけではなく、提案したソリューションがどう問題を解決するのかはっきり説明し同意を得る能力にも現れます。 デザイナーにコミュニケーションスキルが必要な理由 最近、企業や組織ではデザインに対する考えと取り組み方が変わってきています。これまで