WEBエンジニアの役立つ便利ツールを集めてみました。[1]

Pocket
LINEで送る
GREE にシェア
LinkedIn にシェア

1、Loader Generator

Loadingアニメーションを作ってくれる

http://loadergenerator.com/

フォトショップなどでアニメーションGIFを作成したり、CSSでアニメーションを組んだり、なかなか面倒くさい作業ですが、WEBサート上でGenerateしてくれるサービスです。

基本的にクルクル回転するいろいろなバリエーションから、スライドするようなものがあるようですが、一般的なものばかりなんで、使いやすいでしょう。

最近主流のSVGではなくGIFというのがミソですが、旧ブラウザ対応を考えるとむしろこっちのほうがいいという人もいるかもね。

スクリーンショット 2015-02-09 13.44.56

2、codiad

ブラウザでコーディングして表示確認する

http://codiad.com/

いわゆるWEBブラウザベースのIDEです。
ブラウザ上で、コーディングでき、確認までできるので、作業効率はハンパなくいいですよね。
このツール、まあまあ重くないのも特徴で、他にもいくつか使ってみたんですが、インストールから、デプロイまで、使った中では、一番使いやすかったです。
でも、残念ながら、iPadには対応しておらず、この点が対応してくれれば神ツールなんだが・・・

screenshot_12_27

3、LearnGitBranching

WEB上のバーチャルGITを使って勉強できる

http://k.swd.cc/learnGitBranching-ja/

スクリーンショット 2015-02-11 09.01.30

レベルが用意されていて、画面に出てくる指示に合わせて、入力していくと自然とGITの仕組みが理解でき、合わせてコマンドも覚えていける夢の様な環境。
UIが秀逸で、ドットインストールの後にここで試せばかなり修得できると思われます。

4、Moqups

ワイヤーフレームを簡単に作る

https://moqups.com/

スクリーンショット 2015-02-11 09.03.44

モックアップを作る前に、簡単に画面構成を作っておきたい時などに、さくっと作れちゃう、便利なサイトです。

5、Gliffy

フローチャートを簡単につくる

https://www.gliffy.com/go/html5/launch?app=1b5094b0-6042-11e2-bcfd-0800200c9a66

スクリーンショット 2015-02-11 09.02.34

仕様書などを書く時に、フローチャート作成は何使ってます?
Excel?、Word?、PowerPoint?
できればマイクロソフト製品は、PCが重くなるので使いたくないですね。
会社のひな形がそういった書類である場合は仕方がないんですが、単純にアイデアレベルでアルゴリズムを考えるときなど、WEBサービスだと結構気軽に行えるのでおすすめです。

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です