よーいち

[もち | 経営・デザイン・AI @mochitaro_de]

【開催決定】デ��イナー向けClaude Code入門講座🔥

◎開催日時：7月9日（木）20:00-22:00
◎動画アーカイブ配信あり

そろそろClaude Code触らないとやばいな…と焦ってる方。一人だとどう進めていいか分からない方。

２時間で一緒に使えるとこまで行きましょう！

https://t.co/gknl5sOiHN

[しょうへい｜デイトラ代表 / AI経営顧問 @showheyohtaki]

LPのワイヤーフレームから
デザイン作成→実装まですべてAIでやってみた。

かかった時間👇
・デザイン作成：10分
・初期実装：5分
・仕上げの調整：60~70分
・デプロイ：5分
制作時間90分くらいでした。

仕上げは基礎知識がないと難しいけど、逆に基礎知識がある人ならこれくらいはAIだけで作れる。

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

HTML/CSSで作ったサイトとWordPressのサイト、セキュリティ面で何が違うか説明できる？

WordPressの脆弱性とか、狙われやすいとかの話が出る理由はざっくりこれです👇

① オープンソース＝コードが誰でも見られるので弱点を探されやすい
※コミュニティで早期発見・修正されやすいメリットもある
② 何もしないとログインURLが全サイト共通
③ プラグインは他の人が作ったもの。放置したら穴になることも
④ WP本体の更新を放置すると既知の弱点がそのまま残る

WordPressが悪いんじゃなくて「仕組みを知らないまま使う」のが一番危ないよ🥹

でも仕組みがわかると、対策も逆算して考えられるようになる！

「家」に例えた図解作ったので保存しといてね🐣

[God is a Designer @NotGivingUpSoon]

@figma https://t.co/pGnhPyggiu

[もち | 経営・デザイン・AI @mochitaro_de]

作品数も多くてデザインのクオリティも高くて良い。参考にどうぞ！
https://t.co/L0sHxebCzv

[もち | 経営・デザイン・AI @mochitaro_de]

Figma Config 2026で発表された新機能６個をまとめました！！めっちゃ出遅れたけど、まだキャッチアップできてない人は是非チェックしてみてください👍️✨️

https://t.co/tXWUFkbpzH

[せきゆおう🇯🇵Web制作とAIのことを発信する人 @wurst_design]

人のFigmaデザインデータを見たい？

それなら、Figmaには10,000を超えるカスタマイズ可能な無料Webサイトテンプレートとテーマを紹介した公式ページが存在する。

サイドバーといった部分的なパーツから、個人のWebサイトなど...まるっとそのまま使えそうなテンプレートまであるから参考になるよ！

[しょうへい｜デイトラ代表 / AI経営顧問 @showheyohtaki]

AdobeとClaudeの連携が話題ですが、
実はClaudeからUber Eatsを頼んだり
宿泊予約もできるって知ってました？🍔

ここ最近、生活系ツールの連携が一気に増えて、できることの幅がかなり広がりました。

Claudeの連携機能の中から、『あまり知られてないけど便利な7つ』を厳選して紹介します👇

[たにぐち まこと／ちゃんとWeb withAI @seltzer]

少し前に書いた、このnoteがここ数日ご購入いただいていてなんでかと思ったら、

WP7.0がリリースされてバージョンアップしている方がいるっぽい。

役立てていただければ幸いです！

WordPressバージョンアップに伴い、PHPを8.xに��る時の注意点とその方法｜たにぐち まこと＠ともすた @seltzer https://t.co/Qwwf5fWnd1

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

私がWeb制作の中でもコーデイング学習を選んだ理由は「ある程度の正解」があるから、ちゃんと学べば身につけられそうだなって思ったから。

実際にやり始めると自分が書いたコードがPCの画面に反映するのが楽しくて、だんだんゲームみたいな面白さを感じた☺️

もちろん沼りすぎて「意味わからん、いやだ」ってなることもあるけど。

やっぱり楽しみを見出すと、学習も前に進みやすいので「こんな瞬間をゲームみたいに楽しもう！」っていう話を動画を撮ってiro code.内で共有したよ🤝

その中でも特におすすめなのが思いついたものを自由にコードで表現する遊びです🫶

学習中ではないけど数年前にこんな感じで↓
HTMLとCSSでカービィ作って動かしたりしてた⭐️

[よーいち @Webcre25]

目黒川の夜桜
2026年4月3日

[すぐる | ChatGPTガチ勢 𝕏 @SuguruKun_ai]

CSSを使わずにテキストを配置するという、
「30年の常識を壊すライブラリ」が出た....
ㅤ
「Pretext」というライブラリで、
Midjourneyのエンジニアが開発・海外で大バズしている。
https://t.co/eEr7n7ZK6k
Webでテキストを表示するとき
裏側ではこういう処理が走っていて：
ㅤ
DOM測定 → CSS計算 → リフロー（再描画）
ㅤ
この仕組みが90年代から基本変わってなくて、
そしてこれが遅い...という問題
ㅤ
雑誌みたいにテキストが画像を回り込んだり、
新聞みたいに段組みになったり、、、
こういうレイアウトをWebでやろうとすると
毎回このリフローが走っ���重くなる
ㅤ
Pretextはこのプロセスを完全にバイパスする
ㅤ
TypeScriptだけで（C++やRustを使わずに）
テキストの位置を独自に計算して
DOM測定もCSSも通さない
ㅤ
GitHubのベンチマークによると
layout()の処理が約0.09msで完了するらしい👇🧵

[よーいち @Webcre25]

@CRAZY_officials

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

PCデザインのみでスマホはよしなに対応。

コーダーが実務で結構出会う場面だけど、最初は毎回「どう組んだらいいんだろ…」って悩んでた🫠

でもよくあるレイアウト変換ってパターンがあるから、それを覚えたらあんまり迷わなくなったんだよね💡

あとclamp()はこういう時よく使うから、これも覚えておくと超便利✨

パターン知ってれば怖くなくなる🤝
図解にまとめたからチェックしてみてね🤍

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

CSSが効かない、JSが動かない…
ってなった時ひたすらコードを見直してない？

私も最初そうだった。
何時間もにらめっこして結局わからなくて🫠

でもデベロッパーツールの使い方を覚えてから、原因の探し方がガラッと変わったんだよね💡

この3つの機能だけでも使えるようになると、エラーがこわくなくなるよ🌸

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

https://t.co/elMKjmY6Tn

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

https://t.co/OP8gIVfXak

[RikuRyu 💖 | りくりゅう 💖 @miurakihara]

all the emotions in this hug 🥹

#Olympics2026 #MilanoCortinaOlympics2026 #りくりゅう

[よーいち @Webcre25]

avocadonekoが@figmaで「Auto Resize Height」を公開しました。 https://t.co/ecRrIB3qBM

[ちい🐼 | AI×Web制作で人生に選択肢を @tsurupiyooo]

Git使ったことない人向けに「1人で使うGit」を図解にしてみたよ🫶
（最近図解生成にハマってます…）

・Gitって何？→ ゲームのセーブ機能
・GitHubとの違いは？
・覚えるコマンドはたった5つ
・毎日やることは3ステップだけ

「いつかやらなきゃ…」と思ってる人、
この4枚だけ見れば全体像つかめるはず！

保存して実際にやる時に見返してね🔖