プレミアムユーザー限定記事
MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから。
- 2017/12/14
- できることを全力でやる
- 2017/11/25
- 恥ずかしさを感じないためにできること
- 2017/11/11
- プロジェクトを遅延させないコミュニケーションパス管理
UXBOX - プロトタイプをさくさく作るためのWebアプリケーション
Webサイトやアプリなど、プロトタイプをさくっと作ってUIを検討するというのはよくある進め方です。そんな時にはデザイナーしか使えないソフトウェアよりも、誰でも編集できるものを使った方が素早く進められるでしょう。今回紹介するUXBOXはオープンソースのプロトタイピングソフトウェアです。## UXBOXの使い方まずプロジェ...
Flowy - さくさく作れるフローチャートライブラリ
フローチャートを利用する機会は意外と多いです。しかし専用のソフトウェアがないために表計算やプレゼンソフトウェアを使って無理矢理作っているのではないでしょうか。Webブラウザで手軽に作れると便利です。今回紹介するFlowyはシンプルなフローチャートライブラリです。## Flowyの使い方左側にあるノードをドラッグ&ドロッ...
cloudmacs - Webブラウザから使えるEmacs
最近、Webブラウザ上で使える開発環境に注目が集まっています。Visual Studio CodeはついにMicrosoftからオンライン版がリリースされました。さらにvimについてはWebAssembly版のvim.wasmが登場しています。そんな中、Emacsはどうなのか。もちろん手をこまねいている訳がありません。...
p5.riso - 画像を懐かしさ溢れるリソグラフ風に加工
リソグラフというのは印刷方式の一つで、原版を作ることで高速な印刷ができます。色数を押さえることで高速印刷可能で、新聞の折り込みチラシにあるような風合いの印刷が可能です。そんなリソグラフをWeb上で再現してくれるのがp5.risoです。懐かしい風合いの表現になります。## p5.risoの使い方デモです。ちょっとかすれた...
LegraJS - レゴ風ブリックを使ってドローイング
レゴはみんなが好きなおもちゃでしょう。一つ一つは小さなブリックですが、それを組み合わせることで何でも自分が好きなものを作り上げられます。最近ではIoTとも組み合わせて使われています。そんなレゴ風のブロックを使ってドローするライブラリがLegraJSです。## LegraJSの使い方スマイルマークのアニメーション。!
BrowserGap - ブラウザからブラウザを呼び出して安全な環境を確保
セキュアで安全な実行環境を手に入れるにはサンドボックス化されているのが基本でしょう。OSでは普及していますが、Webブラウザではプライバシーに気を配ったモードがある程度です。今回紹介するBrowserGapはWebブラウザの中でWebブラウザを実行する試みです。## BrowserGapの使い方ボタンを押すとWebブラ...
PIXI Tower diffense - HTML5製のタワーディフェンスゲーム
タワーディフェンスゲームが好きな人は多いでしょう。味方をどのように配置するか、どう強化するかによって戦況が大きく変わります。理詰めで考える部分が多いので、開発者は好きそうです。そんなタワーディフェンスゲーム好きに贈るゲームがPIXI Tower diffenseです。PIXI.jsを使い、Webブラウザ上ですぐに遊べま...
GraphQL Network - GraphQLを開発者ツールで分かりやすく表示
GraphQLはREST APIの欠点を改善し、Web APIとして使われる場面が増えていくことでしょう。しかし開発中の難点として、エンドポイントがすべて同じURLであるために、どのアクセスなのかは深く見てみないと分からないという点があります。そんなGraphQLの欠点を克服してくれるGoogle Chrome機能拡張...
CopyPasteJS - コーディングなしでクリップボード操作
HTML5のAPIによって、Webブラウザからクリップボードを操作できるようになっています。共有を促すときにメッセージをクリップボードにコピーしたり、別な機能でコピーしたテキストを貼り付けるといった操作が考えられます。今回紹介するCopyPasteJSは、そんなWebブラウザのクリップボード操作を簡単に行えるようにする...
AWS Icons for PlantUML - PlantUMLでAWSのアイコンを使う
UMLはソースコードを自動生成する夢さえ見なければ、決して悪いツールではありません。システムや処理を可視化するのに最適です。そんなUMLを書く際に昔はドローツールを使いましたが、今はPlantUMLのようなテキストベースも使われます。今回紹介するAWS Icons for PlantUMLはPlantUMLでAWSの各...
WASM Flate - WebAssemblyを使ってファイルを圧縮/伸張
WebAssemblyは標準機能としてはDOMやネットワークが使えないので、その適用部分に悩む人も多いでしょう。Webアプリケーションにおいて、UIやネットワークに触れない部分は多くありません。しかし、ローカルアプリケーションとして考えれば、そのようなアプリケーションの方が多いはずです。今回紹介するWASM Flate...
typical - 軽量なテキストタイピング表示ライブラリ
Webサイトでよく使われるタイピングを模したテキスト表示ライブラリ。メッセージを全文表示してしまうよりも、タイピングしながらの方が目を引く効果があります。この手のライブラリはとても多いです。今回紹介するtypicalはとにかくサイズが小さいのが魅力です。400byte以下でアニメーションしながらテキストタイピングされま...
inkip.it - みんなで小説を書こう
一人で黙々と作業するのは強い精神力が必要です。どうしても人はついサボりがちで、メールをチェックしたり、Twitterに投稿したりしてしまうものです。一日であればまだしも、数ヶ月も集中力を維持するのは並大抵のことではありません。小説を書く、そんなチャレンジをしている方にお勧めしたいのがinkip.itです。コミュニティの...
Touchbar Pet - Touch Barでペットを飼おう
Touch BarがないMacBook Proが発売して喜んでいる開発者は多いでしょう。Touch Barはいらないという方は多く、せっかくあっても持てあましている人が多いようです。これまでにないUIだけに、普及するとしてもまだまだ時間がかかりそうです。Touch Barを全然使っていないという方はTouchbar P...
Invidious - 軽量、多機能なYouTubeフロントエンド
YouTubeは好きなけど、あの広告だらけのインタフェースが受け入れられないという人は多いのではないでしょうか。アドブロックなどを使うことをできますが、開発者であればもっと別な方法もあります。それがInvidiousです。軽量、公式よりも便利な機能が追加されたYouTubeフロントエンドです。## Invidiousの...
Sourcetrail - ソースコードをビジュアル化するビューワー
ソースコードをビジュアル化することで、様々な知見が得られます。アウトライン化されることで全体像を追いやすくなったり、ライブラリ同士の繋がりも分かりやすくなります。そんなソースコードのビジュアル化ソフトウェアとしてSourcetrailを紹介します。対応言語は限られますが試してみてください。## Sourcetrailの...
Prism - Rubyが使えるWebフロントエンドフレームワーク
Webブラウザで唯一実行が保障されているプログラミング言語はJavaScriptです。しかし規模の大きなシステムを書きたがらなかったり、サーバサイドは別な言語を使っているケースもあります。そこで今回はRubyでWebアプリケーションが書けるPrismを紹介します。## Prismの使い方デモです。!
Party Bingo! - Webブラウザでビンゴを楽しもう
ビンゴ大会などで、数字をランダムに表示したいと思うことはないでしょうか。ビンゴに限らず、参加者の中から当選者を決めたいという時もあるでしょう。それを画面上に大きく表示すれば、会場は盛り上がるはずです。今回紹介するParty Bingo!は名前の通り、ビンゴを実現するためのWebアプリケーションになります。## Part...
Spacekit - 太陽系の動きを3Dで表現
宇宙に憧れる人は大勢います。宇宙を知れば知るほど、自分の存在が小さなものだと思い知ります。また、地球以外には移住もできず、まだ月にしか足を踏み入れていない現状が未来を感じさせます。そんな宇宙の様子を3Dで表現するのがSpacekitです。## Spacekitの使い方各惑星は線の上を動きます。!
Responsive Viewer - レスポンシブWebデザインをまとめて確認
レスポンシブなWebデザインが当たり前になっており、その表示確認が大変になっています。Webブラウザの幅を変えたり、スマートフォンやタブレットでの表示を確認したりしている方は多いでしょう。そうした手間を減らせそうなのがResponsive Viewerです。一気に複数デバイスでの表示を確認できます。## Respons...