DeepLを超えるやさしい翻訳アプリとGPTsを作りました
DeepLを超えるやさしい翻訳アプリとGPTsを作りました 苦手な分野の英文を理解するのを助けてくれます。 なぜ翻訳アプリを作ったのか 私は最近ChatGPTのような大規模言語モデルに興味があり、AI開発者の方や、大規模言語モデル関連の情報を発信している方をフォローしていました。 すると最新の論文（英語）や英語のツイートが次々に流れてくるのですが、それらをGoogle翻訳したり、DeepLで翻訳しても、意味不明な場合が多いということに気づきました。 特に海外の方の1行だけのツイートなどは、DeepLで翻訳しても全く意味がわからない場合が多くて困っていました。 AI関連の論文は専門用語が多く、いちいち調べながら読んでいると、1日の大半の時間が情報収集だけで終わってしまいます。 これは要するに「自分の専門分野でない分野の英文を理解するのは大変」ということなので、例えば「Web制作初心者の方が海
ChatGPTを使用して「Web制作者の疑問に答えるWebアプリ」を作りました
ChatGPTを使用するとWeb制作で困ったときやプログラミングの勉強をしていて知らないことが出てきた時に素早く調べることができる…はずでした。 なぜ「できます」ではなく「できるはずでした」と記載しているのかと言うと、高品質な回答を得るためには質問文に毎回さまざまな定型文を記載しなければならない、回答が表示されるまでに時間がかかるなど、意外と面倒なことが多いからです。 ChatGPTで高品質な回答を得るために たとえばWeb制作全般に関して質問するときは「あなたは世界最高のWeb制作者です。」と質問文の先頭につけると良いです。 あるいは、質問する方がプログラミングを学びたての初心者の方であれば「プログラミング初心者でも理解できるようにわかりやすく解説してください」と質問文の最後につけると良いです。 さらに重要なのが「英語で調べて日本語で回答してください」と最後に付け加えることです。 これは
2023年2月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 この画像は、Stable Diffusionの woolitize というモデルを使用して生成しました。 デザイン（Adobe・Figma） AdobeのFigma買収は独占禁止法違反だとしてアメリカ司法省が訴訟を準備していると報じられる XDが突然開発ストップしたのは、独占禁止法を回避しようとしているのだろうなと思っています。 Galileo AI · Copilot for interface design 欲しいUIをテキストで書くと、Figmaで編集できるファイルを作成してくれるAIのようです。早期アクセスをリクエストしておきました。 非デザイナーの僕が「デザインぽい」ことをする時に使う便
2022年10〜11月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 10月は記事を公開しなかったため、今月は10月と11月の記事をまとめています（それぞれの月ごとの見出しを付けています）。 デザイン 組織でデザインが推進できる人の思考術 著者のTwitterより: ✏️小さく絞って正直な目標をつくって計測する。これを続けさえすれば、少しずつ物事は変わっていきます（簡単とは言っていません）。 PhotoshopやIllustratorでPantoneのカラーリングに準拠したファイルを開くには有料ライセンスが必須に Figmaを使いこなせ! デザイナー必須のおすすめプラグイン15選 – ICS MEDIA Figmaの「Auto Layout」を理解する – Qiita
AI描画ソフト「Stable Diffusion」はWeb制作の役に立つか？
最近AIによる描画ソフトがかなり盛り上がっており、その中でも特に「Stable Diffusion」はWeb制作者にとってもインパクトが大きく、使い方によっては制作の役に立つかもしれないと思っています。 まずはStable Diffusionで制作した画像をご覧ください。 これらの画像は写真のように見えるかもしれませんが、どれもAI描画ソフトから出力されたものです。出力後に一切補正はしていません。 「こういう画像が欲しい」と頭で考えてから出力が完了するまでの時間は、約30分程度です。 以下のような、自分でつくるのはちょっと面倒なアイソメトリック風イラストや3DCG風の画像も制作できます。 建築イメージのような画像も制作できます。 自分で作るのは面倒な、タイリング画像（縦横に繰り返し表示できる画像）も制作できます。さらに合わせ技として、「アイソメトリック風のタイリング画像」の制作もできます。
AdobeのFigma買収とAdobe XDのこれから
2022年9月15日に、AdobeがUIザインツール「Figma」を買収する意向であることが発表されました。 これに関してWebデザイン勉強中の方などが「これからFigmaとAdobe XDのどちらを勉強するべき？」と困っているツイートを拝見したのでそれに対する私なりの回答と、 Webデザイナー・UIデザイナーたちの反応や温度感 Web業界の方が意外と見落としている事 脱Adobeしたい方のためのガイド などについてまとめてお話ししたいと思います。 なおこの記事に関しては事実だけでなく、私の予想や、私の周囲のWeb制作者の方の反応や予想なども含まれることをあらかじめご了承ください。 追記: Adobeの製品一覧からXDが消滅し、Adobe XD公式ページは消滅 「Adobeのすべての製品一覧」から #AdobeXD が消えました。「XD」で検索しても出てきません。 Dreamweaverで
Webデザイナー目線で見たiPad版Photoshopの驚きの完成度について
おそらく多くのWebデザイナーが待ち望んだであろうiPad版のPhotoshopがリリースされました。 私はiPad Pro 9.7インチモデルでさっそく使用してみたのですが、なかなか驚きの完成度だったのでどのようなアプリか紹介したいと思います。 著者は 神速Photoshop [Webデザイン編] をはじめとしたPhotoshopやIllustratorの解説書を書いている @Stocker_jp です。 まずは写真補正から 一眼レフカメラで取り込んだ写真を現像しようとRAWデータを開こうとしても、Photoshopアプリでは開くことができません。 先にLightroomアプリで現像しJPEG形式で書き出す必要があります。 続いてPhotoshopアプリで明るさやコントラストの強さを微調整しようとトーンカーブ補正を探したのですが［調整レイヤー］一覧の中にありませんでした。 さすがに何かの
Web制作で気になることのアンケート結果（2019年版）
Web技術 Web制作で気になることのアンケート結果（2019年版） Thursday, October 24th, 2019 Web制作で以前から気になっていたことについて、Twitter の投票機能でアンケートを採ってみました。 アンケートの実施期間は2019年1月〜10月です。 回答者の属性について Twitter のアンケート機能では「誰が回答したか」は質問者でも見ることかできません。 それぞれの質問の回答件数は100〜300件前後で、私のフォロワーの方が多いと思われます。 （ご回答いただき、ありがとうございます。） 私のフォロワーの方は東京の方が多いですが、Twitter アナリティクス によると、近畿、大阪、中部、福岡、東北など日本全国様々な地域の方がいます。 98% が日本在住の方です。 性別（推定）は 71% が男性、29% が女性となっています。 Webデザイン・コーディ
Affinity Publisherを最強のプロトタイピングツールとして使うために知っておきたいこと
この記事の内容 この記事は、2019年7月19日に開催した「Affinity User Group JAPANミーティング」というイベントで私がお話しした内容をまとめた記事です。 以前話題になった PhotoshopとIllustratorのほぼ全機能を搭載したAdobe XD並みに軽いプロトタイピングツールが発売 という記事の続編のような内容です。 主に以下の内容について書いています。 Affinity PublisherによってWebデザインのワークフローがどのように改善するのか「Affinityは軽い」と言われるが、軽いと何が良いのかおすすめの環境設定脱Adobeへの第一歩 動画で観たい方は以下の動画をどうぞ。音声あり、約24分です。 ※他の登壇者の方の内容は、後日別の記事として投稿予定です。 Affinityが目指しているもの あくまでも私の個人的な私見ですが、AffinityはA
PhotoshopとIllustratorのほぼ全機能を搭載したAdobe XD並みに軽いプロトタイピングツールが発売
私は ある出来事 をきっかけにAdobe製品をやめて他社の製品でWebデザインをしようと考えていました。 最初に考えていたのがPhotoshopの代わりにAffinity Photo、Illustratorの代わりにAffinity Designer、そしてAdobe XDの代わりにSketchまたはFigmaのようなプロトタイピングツールを使用しようと考えていました。 最初はこうしようと思っていた しかし、さまざまな可能性を試した結果、今までPhotoshopとIllustratorとAdobe XDの3つのアプリでおこなっていたことをたった1つのアプリで完結させることができ、しかもあらゆる作業をAdobe XD並みの速度でできる方法があるという事に気づきました。 たった1つのアプリで完結させることができるという事に気づいた ここ最近はたった1つのアプリでWebデザインを完結させるワーク
「CS6以降のアプリがいつでもすべて使える」という売り文句のAdobe CCで過去のアプリが使えなくなった件
この記事は、2019年に突然Adobe CCの過去バージョンが利用できなくなった件についてまとめた記事です。 このスクリーンショットはAdobe Creative Stationより。現在 記事は削除されています が、インターネットアーカイブ で見ることができます。 何が起きたのか 箇条書きでかいつまんで書くと以下のような感じです。 Adobe Photoshopのようなアプリケーションは毎年メジャーアップデートされ、たとえば2012年はCS6、2013年はCC、2014年はCC 2014のようなバージョン番号が付けられています。 Adobe CCは月額制のデザイン系アプリケーションが使い放題になるサービス月額サービスのAdobe CCに加入すると「CS6以降（CS6を含む）のアプリがいつでも全て使える」という売り文句で有料会員を集めていたところが2019年5月9日頃、突然2017年やそれ
デザイン作業を行う前に変更しておきたいWindows 10の設定 | Stocker.jp / diary
Web制作でWindows 10を使いたいけど、なんだか動きがもっさりしているとお困りの方はいませんか？ この記事では、Windows 10の設定を見直し、余計な機能をオフにすることでパソコンの動作をサクサクにしたり、デザイン制作などの作業をしやすくするための手順についてまとめています。 パフォーマンスを向上させる Windows 10には「パフォーマンスを優先する」という設定があります。 パフォーマンスを優先した場合、ウインドウの下の影などがなくなりますが、古いパソコンの場合サクサク動作する可能性があります。 設定の変更方法は以下の手順です。 1．Windows 10の［スタートメニュー］から、［設定ボタン］（歯車のマーク）をクリック 2．［システム＞バージョン情報＞システム情報＞システムの詳細設定］をクリック 3．［パフォーマンス］にある［設定］をクリック 4．［視覚効果］というタブの
2018年9月の、これだけは押さえておきたいWeb関連の動き | Stocker.jp / diary
Webニュース 2018年9月の、これだけは押さえておきたいWeb関連の動き Monday, October 1st, 2018 「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 デザイン 追従ヘッダー実装時に使える動作・デザインパターン例 | NxWorld 追従ヘッダーも一般的になってきましたが、こうやって見るといろいろなパターンがありますね。 Adobe macOS Mojave（10.14）対応状況 | Adobe Community 現在、Creative Cloudの最新版とMojave 10.14の互換性があることを確認しております。 と書いてありますが、実際はPhotoshop CCの動作に問題が生じているようです。 また、外観をダー
Photoshop、Illustrator、XD、Sketch…結局どれを使ってWebデザインすればいいの？ | Stocker.jp / diary
Webデザイン Photoshop、Illustrator、XD、Sketch…結局どれを使ってWebデザインすればいいの？ Thursday, September 27th, 2018 Webデザイン制作で使用するアプリは多様化しており、これからWeb制作をはじめたい方にはどれを選べば良いか分かりにくいかもしれません。 それぞれのアプリケーションには一長一短あり、用途によってどのアプリケーションが適切かは変わります。 この記事では、Photoshop、Illustrator、XD、Sketchに絞り、それらのアプリケーションの特徴についてまとめています。 なお、この記事の内容は 世界一わかりやすいIllustrator & Photoshop & XD Webデザインの教科書 という書籍のLesson 01の内容を一部抜粋し、この記事用にリライトしたものです。 Photoshop向きのデ
2018年3月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 Webデザイン Adobe XDでWebデザインをしよう！画面作成からページ推移までの手順を紹介 | Webクリエイターボックス Adobe XDは、Illustratorなどを使用してWebデザインしたことがある方には簡単ですが、Adobe製品を使ったことがない方への説明に良さそうな記事ですね。 Illustrator スクリプト入門 01（はじめの一歩編）｜Seiji Miyazawa｜note PhotoshopやIllustratorはJavaScriptを使用して自動化することができますが、その入門記事です。 AbemaTVのアクセシビリティ 小さな一歩｜しゅんすけ | AbemaTV｜no
2018年2月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 Webデザイン デザイナーの秘密道具@spicagraph デザイン、キャッチコピー、アピールポイントなどの話です。イラスト入りで分かりやすいですね。 Adobe XDで快適！と感じたこと6つ – aicocco’s PhotoLog – g.o.a.t ワイヤーとカンプ、プロトタイプを1つのファイルで できるようになったというのは良いですね。 iOS 11 iPhone GUI | Facebook Design FacebookによるiPhone iOS11 UI素材。PSD、Sketch等。 コーディング CSSで変数（カスタムプロパティ）を使ってみよう | Webクリエイターボックス IE11
iPhone XのiOS 11.11以下と11.12以上どちらにも対応するWebページの作り方
WebKit公式サイトを含め、多くのWebサイトで解説されている「iPhone X対応のWebページの作り方」はiOS 11.11系まで、またはiOS 11.12以上のどちらか一方にしか対応していないため、その両方に対応する書き方について解説します。 この記事の内容は「スマートフォン時代のWebコーディングスクール」の授業資料の一部です。 iPhone X対応していないWebページはどう見えるのか 縦持ちでは特に問題ありませんが、横持ちの場合画面の左右に空白ができてしまいます。 たとえば、このブログの記事ページを横持ちで観ると以下の画像のように見えます。 このブログの場合、bodyの背景色は濃い茶色、ページ全体を包んでいるwrapper要素に背景画像が設定されています。 iPhone Xのセーフエリアについて iPhone Xのディスプレイを横向きにした時、センサーハウジングや角丸の部分を
2017年10月の、これだけは押さえておきたいWeb関連の動き
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 Webデザイン Adobe XD 正式版がついにリリース！CCライブラリで画像もPhotoshopと連携 #AdobeMAX #AdobeMAXJP | Adobe Creative Station Macだけでなく、Windows版も正式版がリリース。名前は Adobe Experience Design から Adobe XD に変わったそうです。 Adobe XD CCに今後追加される機能は？#AdobeMAX #AdobeMAXJP | Adobe Creative Station Zeplinとの連携など「サードパーティツールにも対応」とのことですが、アドオンは自由に作れるようになるのですか
意外と知られていないHTMLの基本の話
私はWeb制作が初めての方向け講座だけでなく現役の制作者の方向けに様々なWeb講座をしていますが、現役のWeb制作者の方でもHTMLに関して意外と知られていないんだなと思うことがいくつかあります。 特に、HTML5以前の古いHTMLの使い方のまま覚えている方が多いように思われますので、この記事ではそれを中心に取り上げてみました。 なお、この記事はHTML 5.1およびWHATWG HTML Standardの仕様書を参考に書いています。 width=”100%” のように数値以外の文字列を “” に入れるのはNG たとえばimg要素などで、ブラウザの幅いっぱいに画像を表示したいという場合、昔はimg要素に width=”100%” のような属性をつけることがありましたが、HTML5からはwidthなどの属性値に数値以外を含めることができなくなっています。（つまり%などの単位を含めることがで
Web制作で気になることのアンケート結果（2017年版）
Web制作で以前から気になっていたことについて、Twitter の投票機能でアンケートを取ってみました。 アンケートの実施期間は2017年1月〜8月です。 回答者の属性について Twitter のアンケート機能では「誰が回答したか」は質問者でも見ることかできません。 それぞれの質問の回答件数は100〜300件前後で、私のフォロワーの方が多いと思われます。 （ご回答いただき、ありがとうございます。） 私のフォロワーの方は東京の方が多いですが、Twitter アナリティクス によると、近畿、大阪、中部、福岡、東北など日本全国様々な地域の方がいます。 98% が日本在住の方です。 フォロワーの方の興味関心としては、モバイル、テクノロジー、Webデザイン、コンピュータープログラミングなどとなっています。 性別（推定）は 73% が男性、27% が女性となっています。 IE対応について Web制作者
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
