kinopi

ChatGPTを使用したコーディングや作業効率化を、日々トライアンドエラーで模索してい…

kinopi

ChatGPTを使用したコーディングや作業効率化を、日々トライアンドエラーで模索しています! (フリーのシステムエンジニア。WEBシステムの開発、要件定義などを担当)

最近の記事

  • 固定された記事

子供用の初心者向けプログラミングはどれがオススメ?

子供用プログラミングソフト、アプリは色々あるので、プログラムをやってみたい場合にどれを使ったら良いかを迷ってしまうかと思います。 ネットで調べるとおそらくScratch(スクラッチ)が多くヒットするかと思いますが、やってみると結構難しく「自分はプログラミングは向いていないのかな?」と思ってしまう人もいるかと思います。 スクラッチよりも簡単にプログラミングできるソフトも多いので、まずは簡単にプログラミングができて、楽しんでプログラミングできるものをポイントに説明していきたい

    • デザイン初心者が、canvaで、ランディングページを作ってみた4(人物素材)

      デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます! いつかランディングページを作ってみたく、いきなり全て作るのは大変そうなので、今回はセミナー系のランディングページの一部を作ってみました。 canvaには人物の素材が無料枠でも結構利用できますので、今回はそれらの人物素材を使用したデザインを作っていこうと思います! 前回までの記事 人物の素材を探す 「素材」から「人物」で検索し、良さげな素材を探していきます。 こういう画像は

      • デザイン初心者が、canvaで、ランディングページを作ってみた3(棒グラフ)

        デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます! いつかランディングページを作ってみたく、いきなり全て作るのは大変そうなので、今回はサービス導入後にどのように効果があったかをアピールする箇所のデザインを作ってみました! canvaで棒グラフを使用したことがなかったので、今回は棒グラフを使用してみつつデザインを模索していこうと思います! 前回の記事 棒グラフの使い方「素材」から「グラフ」の「すべて表示」を選択します。 棒フラ

        • デザイン初心者が、canvaで、ランディングページを作ってみた2(アイコン素材)

          デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます! いつかランディングページを作ってみたく、いきなり全て作るのは大変そうなので、今回はその企業がどんなことをしてくれるかをアピールする箇所のデザインを作ってみました! 前回、canvaで素材の「アイコン」を使用してみたところ、短時間でいい感じにまとまったので、今回はアイコンを中心にデザインしていこうと思います! 前回の記事 今回は、WEBシステム会社のサービスをアピールするデザイ

        • 固定された記事

        子供用の初心者向けプログラミングはどれがオススメ?

        • デザイン初心者が、canvaで、ランディングページを作ってみた4(人物素材)

        • デザイン初心者が、canvaで、ランディングページを作ってみた3(棒グラフ)

        • デザイン初心者が、canvaで、ランディングページを作ってみた2(アイコン素材)

          デザイン初心者が、canvaで、ランディングページを作ってみた(進捗リング、アイコン)

          デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます! いつかランディングページを作ってみたく、いきなり全て作るのは大変そうなので、今回は数値データをアピールする箇所のデザインを作ってみました。 また、canvaに「進捗リング」という機能があるらしく、ちょうどそれを使用してみたかったので、数値的なデータを扱うデザインを作ってみようと思い。 進捗リングで、数値データを表現する進捗リングとは? 「進捗リング」を使用すると、リング上に進

          デザイン初心者が、canvaで、ランディングページを作ってみた(進捗リング、アイコン)

          デザインスクール風のサイトデザインを作ってみた(canva,chatGPT)

          デザインに関しては素人なのですが、最近canvaでサイトのデザインを実験的に作ってみてます! 今回はデザインスクールっぽいサイトのデザインを作ってみました。「デザインスクール」をイメージして作ったというよりデザイン的にデザインスクールっぽくなってしまったので、デザインスクールに着地した感じです、、 以前作ったサイトのデザインシリーズ デザインを作るChatGPTに、キャッチコピーを考えてもらう canvaで、シンプルな図形を探して配置していく canvaで、「素材」

          デザインスクール風のサイトデザインを作ってみた(canva,chatGPT)

          アプリのややこしい画面遷移のコードをChatGPTに作ってもらった(swiftUI,iphoneアプリ)

          アプリの画面遷移について、モーダル遷移と、ナビゲーション遷移と混在させた場合、どのようなロジックとすべきかをChatGPTに作ってもらってもらい、画面遷移についての実装する上でのアドバイスをもらっていこうかと思います。 今回のお題は、モーダル遷移し、そこからナビゲーション遷移させるモーダル遷移で画面を表示し、そこからナビゲーション遷移をさせます。 また最後にスタートである画面に遷移したい場合、そのままナビゲーション遷移とするか、モーダル画面を閉じてスタート画面を表示させるか

          アプリのややこしい画面遷移のコードをChatGPTに作ってもらった(swiftUI,iphoneアプリ)

          暑すぎるので、涼しくなりそうなショップのサイトデザインを作ってみました(canva,chatGPT)

          最近暑すぎるので、canvaとchatGPTを使用し、涼しくなりそうなショップのサイトデザインを一部分作ってみました。想像で作っただけなので本物のショップではないです! サイトデザイン用に、chatGPTでいくつか素材を作りましたが、没となったものをそのままお蔵入りするのがもったいなかったので、それらの素材を使用し、サイトデザインを作るまでの話を作ってみましたので、併せて読んでもらえると嬉しいです! MANATU COFFEEショップの誕生秘話店長! なんかコーヒーショッ

          暑すぎるので、涼しくなりそうなショップのサイトデザインを作ってみました(canva,chatGPT)

          わからないコードも瞬時に解決!複数モーダルを一度に閉じる方法をChatGPTに教えてもらった(swiftUI, iPhoneアプリ)

          ナビゲーション遷移とモーダル遷移を合わせ技で画面遷移を実装したところ、遷移が上手くいかず・・! そもそもモーダル画面の表示制御があまりわかっていなかったので、まずはモーダル遷移の制御について、整理してみることにしました。 この記事では、モーダル遷移で画面を複数表示し(複数被せて)、その後複数のモーダルを一度に閉じる方法をChatGPTに教えてもらったので、その内容をまとめました。 以前、ナビゲーション遷移をChatGPTに教えてもらった際の記事 複数のモーダルを同時に閉

          わからないコードも瞬時に解決!複数モーダルを一度に閉じる方法をChatGPTに教えてもらった(swiftUI, iPhoneアプリ)

          架空のハンバーガーショップサイトのデザインを作ってみた(Canva,ChatGPT)

          久々にハンバーガーを食べたら美味しかったので、CanvaとChatGTPを使用し、架空のハンバーガーショップのサイトデザインの一部を作ってみました。 ChatGPTにロゴやハンバーガーの画像を生成してもらう ChatGPTに「いい感じのサイト作って」と依頼しても上手くいかないので、ChatGPTには、サイトのロゴと、実際のハンバーガーの画像を生成してもらいました(あとキャッチコピーのアイディア) リアルバーガー画像は、なかなか美味しそうなバーガーにならず リアルハンバ

          架空のハンバーガーショップサイトのデザインを作ってみた(Canva,ChatGPT)

          意外と簡単!ChatGPTで作った画像の背景をMacのプレビュー機能で透明にする

          ChatGPTで画像生成する際に、プロンプトで背景を透明にできそうな雰囲気はあるものの上手くいかないので、「Mac標準機能のプレビュー」を使用すると結構 簡単に背景を透明にすることができます! 背景あり画像 背景を透明にする 画像を透明にする手順 ChatGPTで画像を生成 フォルダにて対象の画像をクリックすると標準でプレビュー機能が立ち上がり、画像が表示される。 右上の「ロックあり」を押下し、ロックのチェックを外す 「表示」「マークアップツールバーを表示」画面

          意外と簡単!ChatGPTで作った画像の背景をMacのプレビュー機能で透明にする

          ChatGPTのレクチャーは有料級!iPhoneアプリの画面遷移方法について教えてもらった(swiftUI, navigationDestination)

          日々ChatGPTにSwiftUIをレクチャーをしてもらっています! 最近はお勉強用にクイズアプリを作っていますが、画面遷移周りを色々いじってたら、想定通りに動かず、NavigationStackや、navigationDestinationの仕組みがよくわからなかったので、ChatGPTに簡単な画面遷移パターンをベースに仕様を教えてもらおうと思います! 前回までのswiftUIでのアプリ開発 1.NavigationStackや、navigationDestinatio

          ChatGPTのレクチャーは有料級!iPhoneアプリの画面遷移方法について教えてもらった(swiftUI, navigationDestination)

          [セキュリティ] メンテナンスしていない不要な画面の探すプログラムをChatGPTに作ってもらった

          メンテナンスされず放置されている画面があると、セキュリティーホールになってしまうので、不要なページがないか?を調査し、今後もメンテナンスしないのであれば該当画面を閉鎖する必要があるかと思います。 この記事では、「サイトに存在する画面を探し、それらのURLにリクエストして稼働確認をする作業を自動化できないか?」を検討していきたいと思います。 (参考)不要な画面をメンテナンスせずに、そこがセキュリティホールとなった事例 画面がたくさんあるが、どうやってURLを精査するか?UR

          [セキュリティ] メンテナンスしていない不要な画面の探すプログラムをChatGPTに作ってもらった

          画像生成したらwebpだったので、webpからpngに変換するシェルをChatGPTに作ってもらったら、かなり快適だった

          ChatGPTで画像生成したファイル形式がwebpで、何かと使い勝手が悪いので、pngに変換したく、png変換サイトにアップロードするのも大変なので、ChatGPTでwebpからpngに変換するコマンドがないかを聞いてみることにしました! Macで、webpからpngに変換するコマンドChatGPTの回答 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/i

          画像生成したらwebpだったので、webpからpngに変換するシェルをChatGPTに作ってもらったら、かなり快適だった

          ChatGPTに、クイズアプリのデザイン改修をしてもらったら、すごく効率がよかった!(swiftUI,iPhoneアプリ)

          今回は、前回からの続きでクイズアプリのデザイン周りをChatGTPに改修してもらおうと思います! 進行バーやスコア、タイマー表示のデザインについて修正していきます。 (前回の記事) 前回までの画面イメージ 今回修正した内容を反映した画面イメージ ChatGPTに改修ロジックを教えてもらうそれでは、ChatGPTに改修イメージを伝えて、ロジックを教えてもらいます! タイマーを「秒:ミリ秒形式」にし、秒数の経過がわかりやすくしたい class QuizViewMode

          ChatGPTに、クイズアプリのデザイン改修をしてもらったら、すごく効率がよかった!(swiftUI,iPhoneアプリ)

          ChatGPTに、クイズアプリの機能追加をしてもらう(swiftUI,iPhoneアプリ)

          前回クイズアプリをChatGPTに作ってもらいましたが、その続きで、タイマー、進捗バー、スコア、回答時の丸バツを追加していこうと思いますー 前回のクイズアプリ作成記事 ChatGPTにどのような機能を追加したら良いかのアドバイスをもらう質問文と選択肢以外に、どのような機能を追加した方が良いかを、ChatGPTに聞いてみます。それで追加しやすそうなアイディアを今回追加していこうかと思います。 ChatGPTの回答 ChatGPTに機能追加用のコードを教えてもらうプロンプ

          ChatGPTに、クイズアプリの機能追加をしてもらう(swiftUI,iPhoneアプリ)