ウェブ制作がすご楽に！便利な最新オンラインツール33個まとめ
この記事では、日常行っているWebデザインやグラフィックデザインの制作が格段スピードアップする、便利な最新オンラインツールをまとめてご紹介しています。 カテゴリ分けされたこれらのツールやサービスを利用することで、面倒な作業を自動化し、生産性をアップすることができるでしょう。一度使いはじめると「これなしじゃ考えられない。」、そんな便利ツールが揃います。 コンテンツ目次 1. デザインコレクション 2. イラスト系ライブラリ 3. モックアップツール 4. デザインからコードへの変換ツール 5. プロトタイプツール 6. 生産性アップツール ウェブ制作がすご楽！便利な最新オンラインツールまとめ デザインコレクション SVG Arista このツールはCSSコードを使って、アップロードしたSVGファイルのstrokeとfillプロパティのアニメーションを作成するAnimistaのスピンオフ・プロ
鉛筆描きが一発で線画に！ ラフスケッチを自動でクリンナップする超技術がWebサービスとして無料公開
鉛筆描きのラフスケッチを自動で線画へクリンナップする技術（関連記事）が、早稲田大学の研究チームにより、無料のWebサービスとして一般公開されました。 正式には「全層畳込みニューラルネットワークによるラフスケッチの自動線画化」 まず「参照」ボタンからラフの画像ファイルを指定。「簡略度」のスライダーで補正の度合いを決め、「線画化！」ボタンをクリックして待つと、線画に変換されて表示されます。できあがった線画は、右クリックメニューからPNG形式で保存可能。 操作画面 筆者も実際に、マスコットのITちゃん“らしきもの”を描いて試してみました。結果、補助線や紙のヨレ、線の消しカスレが除去されて、あいまいな線はくっきりとした実線に。一部、もともとあった線が消えたり、本来とは違う形になったりした箇所がありますが、これは補正の度合いや線のクセなどにも左右されるでしょう。問題の大部分は、筆者の画力のつたなさで
Markdown風テキストでダイアグラムが描けるWebツール - Qiita
MarkDownDiagram Markdown風のテキストで、ER図やブロックダイアグラムのようなチャートを描けるツールです。 こちらにインスパイアされて、もうちょっと汎用的にダイアグラムを描けるツールを作りました。 もう保守されない画面遷移図は嫌なので、UI Flow図を簡単にマークダウンぽく書くエディタ作った 特徴としては Webブラウザのみでローカルで動作 配置はマウスでドラッグして編集できる CSSで色や装飾を制御可能 といったあたりです。 githubからclone/ダウンロードして使えます。 オンラインで試すのはこちらでどうぞ。 ローカルでブラウザのみで動作します。index.htmlをブラウザで開いてください。 Chrome推奨ですが、Safari,Firefoxでも動作します。タッチIFは未対応。 機能 テキストでブロックを記述し、ブロック間を線で繋ぐ描画 ブロックをマウ
手軽にリストを作って共有できるサービス「Lisssd」 | ライフハッカー・ジャパン
「Lisssd」は手軽にリストを作って共有できるサービスです。改行で区切られたテキストを入力するだけでリストを作成できます。個別のURLが生成されるので、他人に共有することが簡単です。また、他人が作ったリストをForkすることで自分用にそのリストをアレンジすることも可能。 以下に使ってみた様子を載せておきます。まずLisssdへアクセスしましょう。無料でアカウント登録をしたあと、リスト作成が行えます。タイトルとリストにしたい内容、サムネイルを指定すればOK。作成後には個別のURLが生成されるので他人との共有にも便利。 さまざまなテーマに沿って色んなリストが公開されています。リストをそのままコピーして自分用にアレンジできる機能が「Fork」になります。手軽にリスト化して共有できるので、ぜひご活用ください。 Lisssd （カメきち）
ビジュアル思考派にとって画期的なタスク管理ツール『Trello』 | ライフハッカー・ジャパン
『Trello』は、共同作業を容易にしてくれる優れたプロジェクト・マネジメント・ツールです。また、使うのが「楽しい」ツールでもあります。共同作業以外にも、自分の仕事、家の用事、旅行計画など、さまざまなプロジェクト管理にも使えます。今回は、Trelloで生活全般をオーガナイズする方法を紹介します。 Trelloとは？（どこが素晴らしいのか） Trelloでは、ひとつのウェブページが1枚のボード（board）になっています。ボードの中に複数のリスト（list）を横に並べられるので、プロジェクトの全体像を概観できます。それぞれのリストには、カード（card）と呼ばれるアイテムを追加でき、カードを別のリストに移動したり、リストの中で上下に並べ替えたりできます。 各カードには、チェックリスト、画像、添付ファイル、締切日、色ラベルのほかに、共有ユーザーからのディスカッション・ノートなどを追加できます。
指定したウェブページをまるごとPDF化してくれるウェブサービス「PDF Burger」 | ライフハッカー・ジャパン
Nintendo Switchの純正プロコンを異次元レベルの操作性に!使わない理由がない革新的アダプター
Visualize Website Structure – Sitemap
2014年8月17日 Webサイト制作, 便利ツール Webサイト制作の準備編２：Webサイトの構成図（サイトマップ）。どのページがどこへリンクするのか、ページの重要度など、Webサイトの構成を図にまとめておくと製作途中で変更があった場合でも整理しやすくなります。Webサイトの構成図を作るときのポイントと便利なオンラインツールをまとめてみました。 ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その2 目標：Webサイトの構成を明確にする 必要なもの：紙とペン 対象レベル：超初心者OK！ 目次 誰のため？何のため？Webサイトを作り始める前に。 Webサイトの構成図を簡単に作れる便利ツール ←今ここ Webサイト設計図 – ワイヤーフレームの作り方 PhotoshopでWebサイトのデザインをしよう Photoshopでスライスし、パーツ画像を作成するコツと方法
不要なところは削除して好きなところだけ印刷できる『Print What You Like』 | 100SHIKI.COM
これは超絶便利！ よくウェブページを印刷するといらないヘッダーやらのおかげで意味不明なページを印刷することになるが、そうした悩みを解決してくれるサービスだ。 使い方は簡単で、印刷したいページのURLを入力し、ブラウザ上のエディターっぽいもので印刷したい部分だけを取り出してから印刷するだけだ。 ユーザビリティもしっかりしていて、選択した部分を削除したり、逆に選択した部分だけを残してあとを削除したりすることもできる。 選択できるのはどうやらDOMのようだ。その要素の親要素、子要素を選択することもできるので使いやすい。 印刷用のスタイルシートがある場合もあるが、そうでないサイトも多い。とっても便利なので覚えておくといいですな。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Online Diagram Software - Gliffy