[B! Web制作] ebityanのブックマーク

画像生成AI「Stable Diffusion 2.0」を無料でサクッと使えるウェブサイトを見つけたので生成結果を「Stable Diffusion 1.4」と比べてみたよレビュー

文章(プロンプト)を入力するだけで画像を生成してくれるAI「Stable Diffusion」のバージョン2.0が2022年11月24日に正式リリースされました。そんなStable Diffusion 2.0を簡単に試せるウェブサイトが公開されていたので、実際に画像を生成して従来のStable Diffusion 1.4の生成結果と比較してみました。 Stable Diffusion 2 | Baseten https://app.baseten.co/apps/VBlnMVP/operator_views/nBrd8zP 上記のリンクにアクセスすると、以下のような画面が表示されます。画像を生成するには、下部の入力エリアにプロンプトを入力してから右側の「Generate」をクリックすればOK。今回は上記の入力例に記されているプロンプト「A lion wearing a cowboy ha

ebityan 2022/11/26

リンク

LINE社内で大評判のテクニカルライティング講座で説明した内容をあらためてブログにまとめてみた

LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog こんにちは、Developer Contentチームの矢崎です。LINE株式会社でテクニカルライターとして働いています。今日は、私が1文を書くときに気をつけていることや手法についてお話しします。そして、この書き出しは、6月にmochikoさんが書いた「LINEの社内には「テクニカルライティング」の専門チームがあります」という記事のオマージュになっています。mochikoさんが書いた記事ですごいpvをたたき出したそうなので、人のふんどしで相撲を取ってみようという作戦で始めてみました。この記事ではLINE社内で私が講師を務めた「LINE社内で大評判のテクニカルライティング講座」に沿って、わかりやすい1文を書くコツを紹介していま

ebityan 2020/07/22

web制作

リンク

WEB制作向けブラウザ「Blisk」を使った瞬間、恋に落ちた

それで、「そんなにいいのかな？」と半信半疑でインストールして、使ってみた瞬間、惚れました。プログラミングをする人にとって、Sublime Textは、「恋に落ちるエディター」とよく言われていますけど、WEB開発者にとってBliskは「恋に落ちるブラウザ」といっても過言はないのではないかと思います。以下では、そう思うに至った理由について述べたいと思います。この記事は、2016年7月9日に書いたものです。2016年11月1日にversion 1.0.125.166が出たことにより、機能の一部が有償プランに加入しないと利用できなくなりました。ですので、無料で利用する場合は、30分で機能制限がかかったりするようになったのでご了承ください。 Blisk（ブリスク）とは Bliskは、WEB制作者がサイトの動作確認をする上で、便利な機能がデフォルトで備わっているWEBブラウザです。現在は、Wi

ebityan 2016/10/31

リンク

レスポンシブ対応のCSSフレームワーク22選

手軽に素敵なホームページを作成することができるCSSフレームワークが沢山登場しています。アイコンなども全てセットになったものなどもあり、コーダーでなくとも簡単に作業できることから人気を博しています。今回は、レスポンシブに対応したCSSフレームワークをに紹介します。CSSフレームワークを選ぶ際の参考にしましょう。 CSSフレームワークとは？その特徴とメリット CSSフレームワークを簡単に言うと、Webサイトに必要なパーツや主な機能などがセットになったパックのことです。Webサイトをデザインするとき、通常はイチからデザインを考えて、パーツを揃え、CSSを記述していく必要があります。これは時間がかかる上、Webデザイナーやエンジニアなどの専門家がいない場合、整ったデザインのWebサイトを制作することは非常に困難だと言えるでしょう。そんなときに便利なのがCSSフレームワークです。CSSフレーム

ebityan 2016/03/01

リンク

【絶対見たことある！】デザイナーの中で流行のフォント４選！！ | ベーコンさんの世界ブログ

デザイナーのベーコン（@dogdog464646）です！！プレゼン資料作りにも役立つ、デザイナーがついつい使ってしまうフォント4つを選んで解説しました！「フォントにお金を出すのはちょっと…」という方のために無料フォントを紹介します。いいフォントを使うと明らかにデザインが締まりますので、新しいフォントにチャレンジしてみてくださいね。１つめ『DSきりぎりす』 (DS-kirigirisu) 「DSきりぎりす」このフォントはすごいです。ポケモンで言ったらポッチャマ。GLAYで言ったらTERU。ドラゴンボールで言ったらベジータ。つまりスーパーヒーロー！2016年もまだまだ色んな所で使われていますね。 ▼DSきりぎりす (DS-kirigirisu) (¥16,500 ）こんな感じで使われている ●コンビニ各社で使われているファミマのクッキーエッグタルト。あっちこっちきりぎりすフォント

ebityan 2016/01/13

リンク

初心者でもプロ並みの仕上がり！Web制作・CMSおすすめ21選（随時更新） | Boxilが運営するBtoBサービス・資料紹介メディア　ボクシルマガジン！

始めに自社のコーポレートサイトやサービスの紹介サイトなどを構築している方も多いと思いますが、なかなか綺麗に作るのが難しいですよね。この時に役立つのが「Web制作サービス」や「CMS」ですが、簡単な操作性重視のものや複雑だけど作り込めるサービスなど様々なものがありますよね。そこで今回はお勧めの「Web制作サービス」、「CMS」をご紹介します。後半では、「Webサイト構築・運用支援」を行う企業もご紹介していますが、こちらは随時追記していきます。

ebityan 2015/10/28

web制作

リンク

社員6人の酒店が月間100万PVのオウンドメディアをつくった理由とは？

2500人が渋谷で日本酒飲み比べ今年5月に日本酒イベント「SHIBUYA SAKE FESTIVAL」を開催。両サイトで告知したところ、2500人近くの集客となった。「NOMOOO」スタートから2年後のことだ。ビールや日本酒、ワインなどお酒に関するコンテンツを紹介するメディア「NOMOOO（ノモー）」。2013年に開設したこのメディアを運営するのが「リカー・イノベーション」（東京・足立区）だ。酒屋を母体とするベンチャー企業で、社員も6人と小規模かつメディア経験者も不在のなか、独力でメディアを拡大。現在は月間100万PV、メディアを通じてイベントを告知すれば、2500人の参加者を集められるまでに成長している。メディアとECサイトの2本柱リカー・イノベーションは、現在、主に2つの事業を展開している。ひとつは、「KURAND（クランド）」と呼ばれる、地方のまだ無名な蔵元とオリジナル日本酒

ebityan 2015/10/27

web制作
EC

リンク

縦に長い画像を1枚で印刷する際に自動分割してレイアウトするツール「Print1」 | WebNAUT by Beeworks

モバイルサイトのデザインデータなど、縦長の画像を自動分割して印刷用に1枚にまとめるツールを作成しました。データのアップロード等も不要ですので、機密性の高いデータを印刷する場合でも安心して無料でお使いいただけます！明けましておめでとうございます。本年もWebNAUTをよろしくお願い致します。私の新年1本目の記事は特に正月らしい内容ではありませんが、Web制作の各場面で使える「痒い所に手が届く」ツールを紹介させていただきます。デザイン確認時のよくあるやりとりディレクター：ここでディレクターさんはデザインの確認と指示出しをどのように行うでしょうか？デスクトップ上で修正指示を書き込むようなアプリも幾つかありますが、やはり見やすさや書き込みのしやすさでは紙に印刷して手書きで指示を書く事が多いと思います。その際、縦に長い画像を印刷しようとすると一般的なアプリではこのようになってしまいます

ebityan 2015/01/08

リンク

アフィリエイトで月100万円稼ぐための考え方と手法 - 冒険の書

最近、この冒険の書のブログがちょくちょくとアフィリエイターさんのブログで紹介していただけるようになりました。以前は、目標をブログで公開したり収支報告をすることで、自分にプレッシャーをかけてモチベーションを高めるために更新していましたが、10月に売上が復活したタイミングで収支報告は終わりにしたので、この冒険の書の更新のモチベーションも大きく下がっていました。今は、公開しているカードローンのサイトのデータなどは公開していますが、他に特に更新することもないなぁと思っていたところ、jumblr.というブログの2015年副業でアフィリエイトをはじめる人が注目すべきアフィリエイターブログ5選！という記事でこの冒険の書を紹介していただきまして読ませていただいたのですが、そういえばこのブログはアフィリエイトの手法の話はあまりせず、精神論に終始していた気がするので、少しだけ、自分がアフィリエイトを取り

ebityan 2015/01/05

リンク

iFrame Resizer – iframeサイズを埋め込まれたコンテンツから変更

MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました HTML5からはFlashのようにobjectタグではなく、iframeを使ってコンテンツを埋め込むのが基本になっています。しかしiframeではコンテンツが非同期かつセキュリティ上、そのコンテンツの大きさが分からないのが難点です。 iframeコンテンツの大きさに合わせて自動的にサイズを変更するためには親フレームと子フレーム間でメッセージを飛ばし合う必要があります。Facebookページではこの方法を行っていますが、同様の仕組みを実現するのがiFrame Resizerです。 iFrame Resizerの使い方子フレームの中にリンクがあります。それをクリックすると親フレーム側のサイズ指定を変更できるようになっています。ウィンドウ間でメッセージを飛ばすことでコンテンツのサイズを

ebityan 2014/12/31

リンク

CSSでblock要素を上下左右中央寄せにする、イマドキの方法。 | バシャログ。

Backjoyを買ってみたらほんとに腰が楽なminamiです。 CSSで要素を上下中央寄せする方法は古くから色々と試されてきました。今回は海外のサイトで知って目から鱗だった方法をご紹介します。基本的な設定上下左右中央寄せしたい要素に以下のCSSを設定します。 position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 任意の値 height: 任意の値これだけ。これだけで親要素に対しての上下左右中央寄せを実現できます。追記：親要素にはposition: absolute;かposition: relative; を設定してください。body に対してセンター寄せしたい場合はそのままでOKです！今までtop とleft の値を50%にとって、要素の高さと幅の分だけマイナスのmarg

ebityan 2014/08/06

リンク

読点（、）はどこに打つか？句読点の使い方２［絵文録ことのは］2004/01/08

ネットで文章を書いていると、句読点や記号（「約物」という）の使い方は避けて通れない問題ではあるにも関わらず、その使い方はあまり指摘されることがないようだ。そのため、前回の記事はいろいろと参照していただく結果となった。なお、前回は特に使用頻度の高い話に限ったので、例えば、ハイフン（‐）とマイナス（－）とダーシまたはダッシュ（――）と長音（ー）は違うのだというようなところまでは突っ込まなかったのでご了承いただきたい。そのなかでnaru33さんからのコメント。「、」をどこに入れたら読みやすいかについても何か基準があるのでしょうか？「、」を、どこに入れたら読みやすいかについても、何か基準があるのでしょうか？自分はわりと、後者のようにいっぱい入れちゃう派です。読点「、」つまり「テン」の打ち方は非常に重要だ。しかし、それは他の記号以上に「ルールなき世界」でもある。「こうでなければならない」と

ebityan 2014/07/18

リンク

すごい役立った！Web制作に特化した「提案書」に入れておきたいこと、知識

作成：2014/02/3 更新：2014/11/01 ディレクション > 提案書に必ず書いておきたいことを順を追ってメモしました。イメージはブログ用なので簡易的なものとなっています。フローや内容は会社によって違うと思います。エンジニア速報は Twitter の@commteで配信しています。もくじサイトリニューアルの提案自社分析によるサイトの問題点とその解決策見やすさ、管理しやすさへの主な工夫サイトレイアウト案（トップページ）フロント画面＋管理画面イメージ保守＋運用セキュリティ面でのご提案バックアップと緊急時の対応サイトマップ案強み、実績、事例スケジュールサイトリニューアルの提案企画提案書の流れをメモしておきます。実際に提案するときは、ポイントをおさえて簡潔に説明していきます。必要な部分だけピップアップして使います。自社分析によるサイトの問題点とその解決策

ebityan 2014/02/03

リンク

もう迷わない！「」『』（）【】の“使いどころ"／テクニカルライターが教える、文章の見た目を良くする技術 | きんどるどうでしょう

こんにちは、もう覚えていただけましたでしょうか、晴海まどかです。「テクニカルライターが教える、文章の見た目を良くする技術」第3回。今回は、記号の使い方で文章の見た目をよくできないか考えます。記号の中でもちょっと迷うかもしれない、括弧のお話を中心に。ちなみに、今回の話に関して言えば“縦書き”・“横書き”の区別はあまりありません。前回の記事はこちら：テクニカルライターが教える、文章の見た目を良くする技術「あなたの縦書き文書を美しくする数字の書き分け方」 *この記事はKindle作家の”晴海まどか”さんからゲストポストいただきました「括弧」を極めて美しい文章を作る技術まずは例文をば！今回は先に例文を一つ見てみましょう。なーんとなく、読みにくくないですか？以降、記号の使い方によって見栄えがどう変わるか、考えてみます！記号の代表格、括弧の使い方括弧と一言で言っても、「かぎ括弧」（丸

ebityan 2013/08/24

リンク

サイトを企画・設計する前に決めるべき14の項目（ディレ協主催「0ディレ」講演レポ）

「0からのウェブディレクション講座設計編」に行って来ました！今回の講師はディレ協所属、DCHSの高瀬さん。レポートは初登場のユースケです！よろしくです！制作に”入る前”こそ重要今回は設計編ということで、サイト制作に入る前段階で「明確にすべき項目」と「その方法」にスポットを当てた講演内容となっていて企画そのものの成功率を上げるに何を知るべきかスムーズに制作を進めるためには何を準備すべきかプロジェクトを高速で進めるための戦略のとりかたは？といった、現場のディレクターにとって重要すぎるほど重要な内容がギッシリな”濃い”講演でした。意図不明なサイトや、ぜい肉たっぷりなサービスができあがる原因はどこにあって、どうすれば解消できるのか？今回僕が学んだことを一気に並べて共有したいと思います。資料スライド公開このレポート内で紹介している14項目について、講師の高瀬さんが公開してくれてい

ebityan 2013/08/18

リンク

企画・提案・見積・納品・契約などのテンプレ・知識まとめ２３ | コムテブログ

TL;DR クライアントさんとの打ち合わせや会議の後は、必ず議事録を書いて社内共有します。座った位置や発言なども、思い出しながら簡潔に書きます。おかげで「何を話したっけ？」「言った、言わない」を防げてます。フリーランスの人は、見積書、請求書、契約書、法律などのテンプレや知識があると、スムーズに先へ進めます。その他、ヒアリングシート、契約書など Web 制作業でリアルで必要だった書類系テンプレや知識をまとめました。企画／提案１．企画書企画書はどれくらいのコストで効果（売上）を得るかというのが一番大切。とはいえ、上司を説得できる企画書も大切。以下は企画書の作り方と資料作成サービスなどのまとめです。 [保存版] 最強の企画書の作り方と資料作成サービス完全まとめ | 世界ろぐ “通る企画書”作りの基本／上司を説得できる企画資料の作り方講座#1 | Web 担当者 Forum ２．提案書提案

ebityan 2013/07/29

web制作

リンク

http://www.web-rider.jp/matsuo/%E5%A3%B2%E3%82%8A%E4%B8%8A%E3%81%92%E3%81%8C%E5%8A%87%E7%9A%84%E3%81%AB%E6%94%B9%E5%96%84%E3%81%99%E3%82%8B%E5%A3%B2%E3%82%8C%E3%82%8B%E6%96%87%E7%AB%A0%E3%81%AE%E6%9B%B8%E3%81%8D%E6%96%B9/

ebityan 2013/07/08

リンク

あたし、このデザインを納品したら故郷に帰って結婚するんだ。vol.05｜株式会社アクトゼロ｜クリエイティブブログ

こんにちは、haruです。今回はweb制作現場で頻繁に使われる用語についてまとめてみました。 WEBデザイナー、業界の方ならばよく耳にする用語ではないでしょうか？またその言葉の裏に隠された意味にもツッコんでみました。笑って楽しんで読んでいただけたらうれしいです。それではどうぞご覧ください。 Vol.05 Web制作現場頻出用語辞典デザイナー編vol.1 次回は7月中頃に更新です！お楽しみに…。