エンジニアのための Figma 知識
本記事の多くは Inspect モードを前提に解説しています。 下記に Dev Mode に対応した解説を書いてみたのであわせてご参照ください。 https://codezine.jp/article/detail/18000 エンジニアにデザインツールの知識・習熟は必要か？ しなくても仕事はできると思うのですが、あるとよりクオリティの高い仕事ができることは間違いありません。 という訳でエンジニアがエンジニアとしての仕事をしていく上で「Figma のこういうことを知っておくと良さそう」という知識をまとめてみました。 ユースケースを考える まず始めにデザインは作らないはずのエンジニアが Figma を使う時にどんなユースケースがありそうかを考えてみます。 デザインを元に実装する時 デザインから何かを生成したい時(コードとか画像とか) 自分でちょこっとデザイン修正しちゃう この辺りがあるかな〜
ブックマークしておくと便利！Web制作に役立つさまざまなツールが一箇所で利用できる -SmallDev.tools
CSSやJavaScriptのミニファイ（軽量化）、HTMLやCSSやJavaScriptやSQLのフォーマッター、各種エンコード・デコード、ダミーテキスト・ダミーデータ・ダミー画像・クレジットカードのジェネレーター、diff（ファイル比較）など、Web制作に役立つツールがまとめて利用できるSmallDev.toolsを紹介します。 いろいろなツールが揃っているので、ブックマークしておくと便利です。 SmallDev.tools smalldev-tools -GitHub SmallDev.toolsの特徴 SmallDev.toolsは、Web制作に役立つさまざまなツールが一箇所でまとめて利用できる便利サイトです。完全に無料で利用でき、登録など面倒なことは一切ありません。 最小限のインターフェース🤩 電光石火の速さ⚡ 広告はなし💩 プライバシーフリー🔐（データはすべて、サーバーに
Webサイトの骨組み: ワイヤーフレームを素早く・手軽に・美しく制作する
2013年3月23日 Webサイト制作, 便利ツール Webサイトのデザインを始める前に、レイアウトやページ内で使われる機能を「設計図」として作っておきます。ワイヤーフレームと呼ばれるWebサイトの骨組みをしっかり作っておくと、デザインする段階でスムーズに仕事がすすみます。またクライアントとの打ち合わせでも大活躍。ここではワイヤーフレームを作る為の便利なオンラインツールと「ワイヤーフレームは手描き派！」という人のためのPDFテンプレートを紹介します。 ↑私が10年以上利用している会計ソフト！ オンラインで使えるワイヤーフレーム作成ツール iPlotz iPlotzのWebサイト とにかく多機能でおすすめ。ワイヤーフレームを作る他にプロジェクトマネージメントもできます。オンラインでシェアしたり、JPG, PNG, PDFでの書き出し可能。 トライアルをするにはまずトップページから「Get S
これだけあれば困らない！Web制作を快適にする最新オンラインツール48個まとめ
この記事では、Web制作が快適に捗る、便利な最新オンラインツールをまとめてご紹介しています。 新型コロナウイルスによる影響で、在宅によるリモートワークが増えたことで、誰かと一緒になにかを行う、コラボレーション関連ツールの公開が多くなっています。 その他にも面倒な作業をワンクリックで完了させる、知っておくと便利なジェネレーター系ツールや配色リソースなどが揃います。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. デザインコレクション 2. Web制作便利ツール 3. 配色ツール 4. イラスト系ライブラリ 5. プロトタイプツール 6. アイコンツール 7. コラボ、リモートワークツール 8. 面白、クリエイティブツール Web制作が面白いほどはかどる！便利な最新オンラインツールまとめ デザインコレクション、UIキット Magma St
Web制作の常識が変わる、便利な最新オンラインツール48個まとめ
この記事では、Webデザインやグラフィックデザインの制作スピードを短縮し、生産性をアップする、便利な最新オンラインツールをまとめてご紹介します。 「もっと早く知りたかった」と思わせる、面倒な作業をサクサクこなす時短ツールが勢揃いです。カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. Web制作便利ツール 2. デザインコレクション 3. イラスト系ライブラリ 4. 配色ツール 5. プロトタイプツール 6. コラボ、リモートワークツール 7. 面白、クリエイティブツール Web制作の常識が変わる、便利な最新オンラインツールまとめ Web制作便利ツール The Hero Generator ウェブサイトの魅力的なヒーローイメージを作成できるオンラインツール。グラデーションオーバーレイやボタンスタイル、見出しタイトルの余白など細かい部分も手
セキュリティ担当者が知っておくと便利な無料のセキュリティ関連ツール10種
組織のセキュリティ対策 2018.9.15 セキュリティに役立つツールを10個教えてくれと言われたら、あなたはどんなツールが思い浮かびますか？ 迅速な対応が求められるセキュリティ分野だからこそ、手早く解決の手助けをしてくれるツールの活用は必須とも言えるでしょう。個々の状況に応じたセキュリティ診断や対策、体制の構築は専門家と共に自組織にカスタマイズされた内容で実施・構築していくことをお勧めします。ですが自分で手軽にチェックしたり、調べられたりするツールが手元にあると便利ですよね。 そこで、ここでは無料で利用できるセキュリティ関係のツールを10種類ご紹介します。 ・パスワードの強度を調べる「Password Checker Online」 ・ソフトウェアのバージョンが最新か確認する「MyJVN バージョンチェッカ」 ・脆弱性対策情報データベース「JVN iPedia」 ・攻撃兆候検出ツール「i
コーディングをするときに鼻血がでるほど便利なwebツールリスト - Qiita
普段お世話になっているwebツール達の紹介です。 以下のサイトはすべて 無料 & 登録不要 です。 正規表現 regexper 正規表現を可視化してくれます。 複雑な正規表現を書くときやコードリーディングのお供に重宝します。 Rubular Rubyの正規表現をテストできます。 JSON JSON FORMATTER & VALIDATOR JSON系のツールが集まったサイト。 それぞれ、サイト名とドメインが違うのでリンクはそのうちの１つになっています。 (画像クリックでそれぞれのツールに飛べます。) ひとつずつ紹介します。 JSONをフォーマットしてくれます。 出力結果は折りたたむことができるので、長いJSONを読むときにも便利です。 JSONを含めた様々なデータ形式を変換できます。 Inputの以下に対応。 CSV INI JSON XML YAML Outputは以下に対応。 JSO
これ知ってる？WEBの人なら押さえておきたいツール＆サービス50選 - 死ぬまでWEB屋
公開前に知人に見せたら、読むのに20分もかかったわ！！ と、お叱りを受けましたｗ オススメのツールやWEBサービスということで50ほど紹介していますが、僕の使用感のほかに、ところどころ経験談的なものが入っています。そのあたり、読むのがめんどうな方は読み飛ばしていただければ幸いです。 2万文字近くあるので、お時間ある際にゆるりと読んでいただければと思います。 それではお楽しみ下さい！ サイト解析に使えるツール・サービス import.io Juicer Ptengine GTmetrix CLOUD FLARE wayback timemachine シミラーウェブ Open Site Explorer サクラサクLABO aguse Built with ディレクションに使えるツール・サービス ウェブチェッカー Cat Mdes maindmaister ひとりブレスト 関連キーワード取得
IFTTTだけじゃない--複数のウェブサービスを連携できる便利ツール4選
「ツイートするとその内容を自動的にEvernoteに保存する」「特定の相手からメールを受信したらSMSでプッシュ通知する」といった具合に、複数のウェブサービスを連携させて作業を自動化できるサービスが近年注目を集めつつある。世界的に有名なのは何と言っても「IFTTT」だが、最近では同じコンセプトを持ったサービスが次々と登場してきており、さらなる競争の激化とともにユーザーにとって利便性が高まっていくであろうことは確実だ。 これらのサービスは日本語インターフェースを備えない場合もあり、設定にあたって若干の知識は必要になるものの、単体のサービスでは実現できない便利な使い方ができることから、ぜひともコツを押さえて使いこなしたいところ。今回はIFTTTのほか、同様のコンセプトを持った連携サービス4つについて、その概要や他サービスとの相違点を紹介する。 ◇ウェブ連携ツールの“大御所”「IFTTT」 まず
文体診断ロゴーン
文体診断λόγων（ロゴーン） 以下に文章を入力していただくと、名文の中から類似の文体を探し出します。 また、文章の表現力や読みやすさを評価します。入力の上限は5000字です。
Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能
Webアプリのデバッグやチューニングに役立つ、Chrome Developer Toolsの主要機能を、スクリーンキャプチャ中心で簡潔に紹介。2014年10月に最新情報に改訂。 モダンブラウザーの中でGoogle Chromeは最後発ながら、その機能の潤沢さ、便利さ、高速さからシェアを大きく伸ばしている。そして、今やほとんどのブラウザーではWindowsの場合F12キーを押すことで（Macの場合はCommand＋Option＋Iキーで）手軽に各ブラウザー搭載のデベロッパーツールを利用できるが、特にChromeのデベロッパーツールは、非常に機能が豊富なため、利用している人もかなり多い。 本稿では筆者がよく使う機能や、使うと便利な機能を中心に、Chromeのデベロッパーツールについて紹介していく。なお、本書は執筆時点で、最新のChrome 38を使用している。 機能ふかん 残念ながら、Chro
社内AWSエンジニア向けMac用ツールまとめ資料を公開してみる | DevelopersIO
はじめに こんにちは植木和樹です。今年の5月にクラスメソッドにJoinしてから早半年。当時6名体制だったAWSチームも15名近いメンバーとなりつつあります。 クラスメソッドでは入社した社員にMacBook Airが貸与されます。薄くて軽くて持ち運びに便利なので、いつでもどこでも仕事ができます（歓喜）。さて入社して数日間は仕事をするための環境作りに時間がとられるものですが、なるべく早くフルスロットルな仕事体制を整えてもらえるようクラスメソッド社内で使っているツール類をまとめてみました。 セットアップ手順まで記載するとエントリが長くなるのでツールの紹介のみです。参考となるセットアップ手順については紹介内でリンクを貼っています。 業務系ツール Chrome 配布元サイト Chrome ブラウザ 作業ミスを防ぐため、お客様のAWSアカウントごとにChromeユーザーを切り替えて使いましょう。設定方
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web担当者が日々の仕事をミスなく進める超便利タスク＆コミュニケーション管理ツール11選 | Webワーカー向け便利サービス
プロジェクト管理ツールをWeb上で実装出来るPHP製のソフトウェア・Solo