タグ

ブックマーク / www.webcreatorbox.com (12)

  • 私が作業中に聞いているITやWebデザイン関連のPodcast

    2023年6月13日 Web関連記事, インスピレーション, フリーランス 仕事中はBGMを流していますか?私は集中したい時やがっつり考えなきゃいけない時などは無音、または環境音を流してたりしますが、頭をさほど使わない単純作業のときには音声型の配信コンテンツであるPodcastを流していたりします。そこで今回は私が登録しているPodcastをご紹介します! ↑私が10年以上利用している会計ソフト! Webディレクションやってますラジオ 現役Web制作会社の代表によるクリエイター向け仕事力アップのための番組。声優をされていた経歴もあるため、当に心地よい声で、飽きることなく聞き続けられます。Web業界に関する動向や働き方、ひいては人生論まで、幅広いお悩みに答えてくれますよ。 ひまじんプログラマーの週末エンジニアリングレッスン 駆け出しエンジニアに対するメンタリングを盗み聞き!というコンセプト

    私が作業中に聞いているITやWebデザイン関連のPodcast
  • 「AIによる自動Webデザイン」についてChatGPTでブログ記事を書いた+使ってみた雑感

    2023年10月20日 Webサイト制作, 便利ツール アメリカOpenAIが公開した自然な文章を生成する人工知能AI)、ChatGPT。チャット形式で質問に答えて自然な言葉で返してくれます。みなさんもう使ってみましたか?今回は「AIによる自動Webデザイン」について、ChatGPTにブログ記事を書いてもらいました!ChatGPTを使ってみた中の人の感想は記事の最後に掲載しますね。 ↑私が10年以上利用している会計ソフト! ↓ ここからChatGPTの生成した文章です。↓ 近年、人工知能(AI)技術Webデザインにも影響を与えています。自動Webデザインという手法が開発され、Webサイトのデザインを自動的に行うことが可能になりました。 この自動Webデザインは、ビジネスオーナーやマーケターなどのWebサイトを作成することを求められていない人たちにとって非常に有用です。Webサイトを作

    「AIによる自動Webデザイン」についてChatGPTでブログ記事を書いた+使ってみた雑感
  • DeepL翻訳で海外のWebサイト制作情報を読みあさろう!

    2023年2月7日 便利ツール, 海外情報, 英語 DeepL(ディープエル)翻訳は、ドイツの企業が開発している機械翻訳エンジン。自然で高い品質の翻訳文が話題となっています。今回はそのDeepL翻訳を、Webデザインや制作、技術系の分野で活用していく方法を紹介します! ↑私が10年以上利用している会計ソフト! DeepL翻訳の使い方 DeepL翻訳の翻訳精度の高さは一度使ってみると実感できるかと思います。基的にはDeepLのWebサイトにアクセスして、翻訳したい文章をコピペするだけ。ただ、毎回DeepL翻訳のWebサイトに文章をコピペするのって地味に面倒ですよね…。 そこでおすすめなのがDeepL翻訳のChrome拡張です。インストールしてWebサイト内の文章を選択すると、カーソル付近にDeepLマークが表示され、クリックすれば翻訳されます。 技術系ドキュメント特有の用語やコードを含んで

    DeepL翻訳で海外のWebサイト制作情報を読みあさろう!
  • 【第3弾】少しのコードで実装可能な15のCSS小技集

    2022年4月27日 CSS CSS小技集シリーズの第3弾!「【第2弾】少しのコードで実装可能な20のCSS小技集」から3年が経ち、さらに便利でサクッと使えるコードが続々登場!特にこれまではJavaScriptで実装していたものがCSSだけで実現できるようになったりと、進化が凄まじいです。初心者さんからベテランさんまで要チェック! ↑私が10年以上利用している会計ソフト! 目次 スムーズスクロール スクロールスナップ スクロールすると要素を固定 画像をトリミング CSSで計算式を書く テキストを円形に回り込ませる Webフォントを使った時の表示遅延を回避する テキストに波線を引く テキストの上に記号を表示 表のセルの幅を統一する 入れ子になったリストもカウントする フォームのプレースホルダーの文字色を変更 しましまのライン メディアクエリーを使わずにタイル型レイアウトをレスポンシブに対応

    【第3弾】少しのコードで実装可能な15のCSS小技集
  • 生まれ変わったDreamweaver CC 2017をいじってみた!Codaから出戻る…かも…

    2016年11月7日 便利ツール 数日前Adobeのエディターツール、Dreamweaver CC 2017が新機能とともにリリースされました。過去にDreamweaverからCodaに乗り換えた私ですが、苦楽をともにしてきたCodaさんがどうもアップデートのたびにプラグインがうまく動かないなど、使いづらくなってきて…。そんな時に新生Dreamweaverの情報を耳にしたので、さっそく試してみました。 ↑私が10年以上利用している会計ソフト! Dreamweaver CC 2017をインストール Adobeのツールはサブスクリプションモデルなので、Creative Cloudに契約する必要があります。Photoshop CCやIllustrator CCなど、多彩なAdobeツールが使い放題のコンプリートプラン(月額4,980円)、Dreamweaverのみ利用できる単体プラン(月額2,1

    生まれ変わったDreamweaver CC 2017をいじってみた!Codaから出戻る…かも…
  • UXデザイナーって何するの?

    2016年6月1日 UXデザイン 最近、求人サイトなどを見てみると、「Webデザイナー」という職種での募集よりも「UXデザイナー」での募集をよく見かける気がします。しかし、UXデザイナーって実際どんな仕事をしているんでしょうか?Webデザイナーとは何が違うんでしょう?今回はUXデザイナーの仕事内容と、どんなスキルがあればUXデザイナーとして活躍できるのかを調査しました! ↑私が10年以上利用している会計ソフト! UXデザインって何? UXとは「User Experience(ユーザー・エクスペリエンス)」の略で、日語では「ユーザー体験」などと訳されています。見た目だけではなく、画面や機能の使いやすさや、使っていくなかで「楽しい!」「心地いい!」とユーザーに満足してもらえるかを考えた概念です。 UXデザイナーの仕事内容 「UXデザイン」について、なんとなくわかっていても、なんだかふわっとし

    UXデザイナーって何するの?
  • 引きこもりがちなフリーランサーやリモートワーカーの人は、積極的に人に会うようにしよう!

    2016年4月27日 フリーランス, ライフハック Webデザイナーとして働いている私がリモートワークに完全移行して約3年。私のようにWeb系・IT系業界でフリーランスリモートワークをしている人は、PCMacとインターネット環境さえあれば仕事ができちゃう分、人と会う機会が激減してしまいます。今回はそんなフリーランサーさん、リモートワーカーさんの「脱引きこもり」にフォーカスします! ↑私が10年以上利用している会計ソフト! 人に会うって、どんなメリットがあるの? フリーランスリモートワークとして自宅勤務をしていると、なんだか一人で孤島にいるような、寂しい気持ちになりがちです。他のチームメンバーやクライアントとのやり取りもメールやチャットがほとんどで、気がついたら今日一日、一言も声を発していない…なんてことはないですか?もちろん、そんな生活も悪くないかもしれません。でも、ちょっと誰かと話

    引きこもりがちなフリーランサーやリモートワーカーの人は、積極的に人に会うようにしよう!
  • CSS Shapesでテキストを回り込ませるレイアウトを表現 | Webクリエイターボックス

    2019年5月16日 CSS Webでのデザインはどうしても四角形のボックス型になりがち。印刷物だとテキストの配置ももっと自由にできますよね。今回はテキストを画像などの形にあわせて回りこませたり流しこんだりできちゃう CSS Shapes について紹介します! ↑私が10年以上利用している会計ソフト! CSS Shapesとは CSS Shapesを使えば、円形や多角形、画像に合わせて、そのまわりに float で横並びにしているテキストを回り込ませて配置できます。雑誌や印刷物の広告などでみかけるレイアウトのひとつですね!これがWebでも表現できるようになれば、デザインの幅がグンと広がるのではないでしょうか? 通常、テキストと円形の要素を横に並べると、この図のように四角形をベースとした配置になり、円の右上・左上・左下・右下には空白ができます。そのスペースを shape-outside プロ

    CSS Shapesでテキストを回り込ませるレイアウトを表現 | Webクリエイターボックス
  • 10歳のこどもから学んだユーザビリティ向上のポイント

    2015年9月8日 ユーザビリティ 夏休みの後半、原稿用紙15枚の自由研究に苦しめられていた姪っ子(10歳)を「楽しそうだな〜」と手伝っていました。そんな時「私も久しぶりに自由研究したい!」と思い、ちびっこが家にいることですし、最近のちびっこがWebサイトをどのように利用しているのか研究してみることにしました。という事で今回の記事は自由研究風に進めようと思います! ↑私が10年以上利用している会計ソフト! 調べたいこと 認知度の高いWebサイトを、小学生がどのように利用するのかを観察し、こども向けのWebサイトに必要なもの、Webサイトを制作するうえで注意すべき点を調べます。 予想 難しい漢字は読めないので読みとばす イラストやキャラクターなど、可愛いものに興味を示す 明るい色彩のサイトに興味を示す まだ習っていない漢字や難しい表現は読み飛ばし、自分の理解できるもののみにフォーカスしていく

    10歳のこどもから学んだユーザビリティ向上のポイント
  • スクリーンショットにコメントをつけてシェアできるツール

    2017年11月23日 便利ツール Webサイトに修正指示を出す時、どんなツールで、どのようにシェアしていますか?該当ページのスクリーンショットを撮影し、その画像に指示を入れていく…という方が多いかな、と思います。今回はWebサイトの制作者のみならず、制作者に指示をだす人や、クライアント側も使える、修正指示がグンと楽になりそうなツールをいくつか紹介します! ↑私が10年以上利用している会計ソフト! AUN[あうん] AUN[あうん]はふせん紙の感覚でWebサイトや画像にコメントを残し、共有できるツールです。登録不要!無料で気軽に利用できるところが魅力的。対象となるWebサイトのURLを入力するだけでスクリーンショットを撮影でき、指示やコメントを残していけますよ。さっそく試してみましょう。 サイトからURLを入力し、読み込みが終わると、画面をトリミングするかどうかの選択画面が表示されます。読

    スクリーンショットにコメントをつけてシェアできるツール
  • 料金表をわかりやすくデザインするコツ。実例やレスポンシブ対応サンプルも!

    2017年10月31日 CSS, Webデザイン, Wordpress サービスを提供しているWebサイトにとって大切なのが、各プラン内容とその料金。複数の選択肢がある場合、その違いがわかりにくかったら、ユーザーを困惑させてしまいます。今回はWebサービスのコンバージョンにも繋がる、わかりやすい料金表の作り方を考えてみたいと思います。 ↑私が10年以上利用している会計ソフト! 料金表をデザインするときのポイント 1. プランの違いをわかりやすく まずは各プランのサービス内容と料金をわけることから始めましょう。各プランの名前を料金表の先頭において、ひと目でどのプランについてまとめているのかを認識できるようにします。プランをグレードアップするごとにプランの名前もランクが上がるよう命名しましょう。 よくあるプラン名: ブロンズ・シルバー・ゴールド・プラチナ マイクロ・スモール・ミディアム・ラージ

    料金表をわかりやすくデザインするコツ。実例やレスポンシブ対応サンプルも!
  • アイコンフォントからSVGへ!より手軽にベクター画像を表示しよう

    2014年7月3日 SVG ベクター画像を表示する際とっても便利なSVG。名前を聞いたことのある方も多いのではないでしょうか?SVG自体は10年以上前から存在するのですが、HTML5の普及とともに多くのブラウザーでサポートされるようになり、今年に入ってから徐々に見かける機会が増えてきました。今回はそんなSVGにフォーカスしようと思います。 ↑私が10年以上利用している会計ソフト! 2014年7月3日 追記:SVGスプライトの書き方について修正&追記しました。 SVGってなに? SVGScalable Vector Graphics)はIllustratorで作成したようなベクター画像を表示する技術です。Web上で一般的に使われる画像形式であるJPEGやPNGなどのビットマップ形式とは違い、ベクター形式の画像は、拡大縮小しても画質が劣化しません。 Appleがレティナディスプレイを発表して

    アイコンフォントからSVGへ!より手軽にベクター画像を表示しよう
  • 1