開発日記

2024-05-29 08:39:51 #つぶやき

ひとりデスマ

このサイトをLaravelで作ろうと思った時、ついでにGit運用も（個人では使わんので忘れてきてるんで）今回ちゃんと導入して業務スキームっぽくしてみようかと、サーバにbareリポジトリ作って、テストサイトにテストブランチ、本番サイトに本番ブランチでセット、サイト内でローカルブランチから更新するモデルを構築した。

そうしてチェックボックスリストで課題管理するようにしたら、面倒くさいクライアントと思考停止エンジニアがPDCA回してるような状態になって、細々した課題が永遠に追加され続けるという一人デスマーチになってもうてたｗ。

まあ過去色々と個人サービス作っては塩漬けされてったのも、間が空いては課題や変更箇所が分からんようになってって、面倒くさくなってやる気がブーストするまで放置ってパティーンになってもうてたんで、今回の運用モデルはアジャイルが勝手に回ってくれて非常に助かる。とりま課題の取捨選択もちゃんとせんとなんよな。
資料大事、ルーティーン大事、そして取捨選択も大事よなあ。

時短な流れで今回デザインテンプレート持ってきてそのまんまLaravelでCMSはめるってモデルでやったけど、「自分で選んだデザインテンプレートでCMS化」ってメニューもありかもなと思った。変な内部構造のWPやらを使うより、ずっとシンプルで将来的なスケーラビリティもあってええやんって気がする。
もうちょっとちゃんとモデル化して営業モデルにしてみようか。

2024-05-20 10:27:50 #affinity

たまーにイライラさせられてた長年のAffinity Photosの謎が解消された話

冒頭に結論

Affinity Photosのレイヤーには「画像」と「ピクセル」がある。


＊レイヤーパネルのアイコンが違う

  • 「画像」レイヤー：拡大縮小したり回転したりフィルターかけてもレイヤーデータが劣化しない。画像自体の編集はできない。
  • 「ピクセル」レイヤー：いわゆる普通の画像レイヤーで、切ったり貼ったり書き込んだりできる。

「画像」レイヤーを編集したい場合、「レイヤー」メニューで「ラスタライズ」して、「ピクセル」レイヤーに変換する。

AdobeからAffinityに乗り換えた

イラレもフォトショもバージョン3から使ってた。やがてCSになりCCでサブスクになりとアプデしてきたが、フリーランスになって以降はもっぱら仕様書等々の資料作成と、たまに動画を作成するくらいで、バージョンアップの度に価格が吊り上がってたAdobeは超絶低コスパの厄介なツールになってたが、Adobeの買収＆買収で、代替アプリはすっかり焼け野原ｗ。乗り換え先が無くて長い期間倦ねてた。

そんなところにAffinity登場。注目してた所にセールをやってくれたこともあって、Adobe CCからAffinityに乗り換えたのはもう数年前。ちなみに動画編集は同時期にDaVinci Resolveに乗り換えた。

Adobeのつもりで使うと超絶理解不能な根本設計からがまるで違うアプリやが、動作は速いし、設計思想を理解しさえすれば、Adobeと比べてもほぼほぼ遜色無い機能が揃ってる。何より買いきりが助かる。

バージョン2になって更にいい感じに仕上がって、非常に重宝してる（せめて縦書き文字をサポートしてくれたらもう何も不満は無い。…いや、Designerのパス編集周りはもうちょっと頑張ってほしい。後、Photosで切り抜き選択とか画像拡張とかAI機能も頑張れ、ちょー頑張れ）。

たまーに遭遇してた不具合

しかし、色々とやりたいことの機能割り振りが分かりにくいAffinityで、特に謎な不具合として認識してたのが、Affinity Photosでたまーに部分箇所の複製やパッチ修正をしたい時、画像の一部を矩形や投げ縄で領域選択してコピペしようとすると、なぜかレイヤー全部しかコピペできず、部分のコピペができない、という現象。

「バグか？バグやな」と、その時その時で色々と別のやり方を工夫して処理してたが、長く使ってると「これはバグや無いな」な感じ。ごくたまーにしか遭遇せんが、遭遇する度に隔靴掻痒でちょーイライラさせられる。

そしてまた「それ」に遭遇した！いい加減怒髪天で、この機会に徹底的に原因追求して解消する！

原因究明

ってことで、「Affinity Photos 2 矩形選択 全体がコピーされる」とか「Affinity Photos 2 部分選択してもレイヤーごとコピペされる」とかでググってみる（ちなみに「Affinity Photos」を指定せんとフォトショの情報ばっかダクダク出てくるし、「2」を指定せんと「無印（1）」の情報とか、iPad版の情報ばっか出てくるのが非常にダルい）。が、そこはまだまだマイナーアプリなんか、現象がユニークなんか、全然ヒットせんなあ。そしてYoutubeに行って探してみると、見る動画見る動画、普っ通ーに矩形や投げ縄選択で部分コピペしてる。いやうん、ワイもいつもはしてるんやけどやな。今出来んこの現象がなんなんかっていうのがやな。

うーん。まあ試しに、素材集から適当に選んで部分選択してコピペってしたらやなあ…





出来るがな！ほならば、ファイルを開いて自動選択して削除…




出来るがな！えぇ〜？さっき出来んかったのってどうやってたんやったっけか…？と、色々記憶と作業を辿って、「開いてる画像に画像ファイルをドロップ」すると、部分選択してもレイヤー丸ごとしかコピペできない。（後に、たまーになってたのは「クリップボードから新規作成」と判明）





キタコレ！

何やろ？何が違うんやろか？と目をこらすと、レイヤーのアイコンが違うぅ！



マウスポインター当てると出るヘルプタグの「ピクセル」「画像」でググると、Affinityには「画像」レイヤーと「ピクセル」レイヤーがあり、「画像」レイヤーはAdobeでいうスマートオブジェクトみたいなもん（？）で、劣化せず扱えるデータの塊らしい。

これを普通に編集したい場合は、レイヤーを右クリックで「ラスタライズ」すると「ピクセル」レイヤーになり、部分選択してコピペしたり削除したりできるようになる、と。





Affinityのドキュメントサイト「画像レイヤーを「ピクセル」レイヤーにするには」には、ピクセルレイヤーに変換する方法として「[ペイントブラシツール]または別のブラシベースのツールを選択して、レイヤーにペイントします。」と書いてるが、描けへんがな！Affinityってこういうトラップが結構あんのよなあ。

そういえばそう、矢印とか罫囲みとかをちょっと描き込もうとして「なんや？なんで書けへんねん！」ってイラつくのもたまーになってた。結局、別レイヤーで描いたり、Designerで描き足してエクスポートしたりしてたがな。いやああああ。くっそやなああああｗ。

ということで、冒頭の結論やった。

結構重要度の高い、Affinity Photos使う上で理解必須な仕様やと思うんやが、今までAffinity Photosの使い方調べた中で目にしたことが無いんよなあ。どのルート通ったら知れたんやろか？

まあこれで今後のストレスがかなり軽減された気がする。結果オーライ。

2024-05-15 16:18:44 #Laravel

LaravelでWebサイトを作ろう

＊このサイトの開発記録です。

2023年にUnityでWebGLで色々とやり始めて、コンテンツをアップする環境作りたいなあと考えてた。WordPress使いたくなくてｗサイトも長く放置してるし、Laravelの収得もせなあかんよなあと思ったりで、2024年になって「Laravelでサイトをリニューアルしよう計画」を発動。

先ずはLaravelの最低限の概要を収得。
2021年頃にチュートリアルとかをやってた資料が残ってたが、ほとんど記憶に無いｗ。資料を読み返しつつ、ディレクトリ構成やルーティング、ViewとBladeという基本構成を再履修。

その時にインストールしたと思われるLaravelの残骸がローカルにいくつか残ってたんで、これを使ってWebページを表示してみよう。
＊動かんかったりしてたが、トラブル時演習としてエラーメッセージから生成AI使ってライブラリのアップデートとかして復旧。

WPにする以前のサイトはフロントもHTMLとCSSの演習として作ってたが、まあデザインセンスが無いんでｗ、今回はネットからデザインテンプレートをチョイスしてさっくりと組み付けたい。
色々と見て回り、Free Bootstrap Themes & Templates - Start Bootstrapから、Freelancer - One Page Theme - Start Bootstrapをチョイス。ポップ感が良き。

LaravelはBladeというテンプレートエンジンが標準装備され、専用タグを使ってテンプレートに各コンテンツViewを差し込んで表示する事で、デザインとロジックを分離できる。
今のところはトップページだけなんで、何ならそのまんま組み付けてとっとと公開してもいいけど、テンプレート化することで、他のページへのでザジン適用が容易になり、今後デザインやレイアウトを変更する場合にお手軽になる。

ということで、テンプレート化していこう。
ダウンロードしたデザインテンプレートのファイル名「index.html」を「index.blade.php」に変更して、/resources/views/layouts/にコピー。

  • index.blade.phpの内容を編集する。
    • <title>～</title>を<title>{{ config('app.name', 'Laravel') }}</title> にすると、.envのAPP_NAMEの値が入る。@yield('title')にして、Viewで@section('title', '[タイトル]')として置き換えてもいい。
    • コンテンツを表示したい箇所に@yield('[セクション名]')を書く。Viewの@section('[セクション名]')〜@endsectionの内容が表示される。
    • その他、とりあえず不要な部分は{{-- ～ --}}で挟んでコメントアウトしていく。
  • 画像素材は/public以下にそのままコピー。
    • テンプレート内の画像参照のリンクを href="{{ asset('[public以下の画像ファイルパス]') }}" に修正する。
  • css、js等のファイルをpublic/css、public/jsにそのままコピーする。
    • css内の参照リンクを asset('[public以下の画像ファイルパス]') に修正する。
  • テンプレートを利用するViewを、 resource/view にindex.blade.phpで作成
    • テンプレートの指定「@extends('layouts.index')」（パスは「/」を「.（ドット）」、「.blade.php」は省いて記述）と、@section('')〜@endsectionの間に、テンプレートに表示するコンテンツを書く。

コンテンツはデザインに合わせて「お知らせ」と「ポートフォリオ」を置く予定。「ポートフォリオ」の内容が込み入ってるんで、どう組み付けるかを検討しつつ、とりあえずは表示テストとしてcontentセクションをひとつだけ置く。

シンプルにテンプレート設定とcontentセクションのみの構成のテスト用のViewを/viewsの直下に「index.blade.php」で書く。

/views/index.blade.php

@extends('layouts.index')
@section('content')
  テストです。
@endsection

これを表示するルートを設定する。ルートはURLに対する表示対象の設定で、/routes/web.phpに書く。
コントローラは今のところ無いんで、ルート（'/'）のリクエストに、上の「index」View（index.blade.php）を返すよう設定。

/routes/web.php

Route::get('/', function () {
    return view('index');
});

これで、ブラウザからLaravelのルートにアクセスすると、テンプレートが表示される（はず）。

LaravelはWebサーバ機能を持っていて、コンソールから$ php artisan serveとするとブラウザからアクセスできる。
今はローカル環境のMAMPに入ってたLaravelを使ってるんで、ブラウザから設置のLaravelパスのpublicにアクセスすると、無事テンプレートが表示された。やったー。

取りあえずテンプレート表示まで完了。ここから別件やり始めてしばしLaravelから離れた。

2024-05-15 11:02:01 #メモ

画像の回転

ここ最近、紙の資料をやり取りする会合に参加せざるを得ずで、無駄な紙資料が廻ってくる。
紙ゴミにしかならんので、スマホで撮影してMacでzipにまとめてるが、写真画像って無駄にデカいんで、別用途で作ったAutomatorスクリプトで内容確認できる程度のサイズに一括でリサイズしてたが、見返すとサイズがまちまちになっとる。

Macに移してFinderのクイックルックで縦横合わせに回転後、リサイズさせてたんで、試しに画面キャプチャしてクイックルックで回転、Affinity Photos 2で開くと回転してないー！(；´Д｀)

調べるとExif設定で回転させてるだけで、元画像はそのまんまやった。そういやえらい昔にこの手の面倒くさいのがあった記憶が。
AutomatorスクリプトでGraphicsMagickを使ってリサイズさせてたが、その保存後の画像は実画像が回転してるんで、GraphicsMagickのパラメータの順番とか変えたり、回転適用後の変換とかがいるんやなあ。

取りあえずは面倒くさいんでメモ。
しかし、何年経ってもこういう細々した面倒が続いてんなあ。もう21世紀も四半世紀経ってんやでｗ。

2024-05-11 17:20:48 #このサイト

サイトリニューアル

随分前にこのサイトをWP（WordPress）にした。
当時よく使われてるCMSの筆頭で、サイトの管理画面にセットアップメニューがあったんで、見場のいいテンプレートや便利なプラグインが使えてコスパがええし、カスタムも色々やってWP案件も取ってみるか、と思ったりもしてセットアップした。

が、WP自体の設計の面倒くささと、各種プラグインのおびたすき感、何よりアップデートの度にカスタムしたCSSやテンプレートが上書きされるのにウンザリ（まあこれはそのまんまで使ってたからしゃーないけどｗ）して、その内面倒くさくなって放置状態になりましたとさ。めでたしめでたし、ではない。

最近はまってたWebGLで色々実験したいことがあったりしたが、面倒くさいWPを触る気になれず、とっととWPは捨てて、すっかり放置状態の自作FW（フレームワーク）「BABFW」にリプレースしてリファクタもろとも進めるか、それとも仕事で使ってる「CakePHP」を使うか、とか考えつつも、結局面倒くさいままに幾星霜。

そうしてアプリやサービスの開発に打ち込んでたVR界隈もすっかり冷え込んで、使ってたUnityにもケチが付いたり、ゲームエンジンのスタンダードがUE5（UnrealEngine5）に移る流れになったりして、時代が変わっていき、老いらくのプログラマー人生も後何年続けられるんやろか、と考えたりして、最後に自分のスキルで仕事をやり尽くしたいと、またぞろWebアプリ界隈に復活！とポチポチとネットで案件を探してみるも、CakePHPの案件はすっかり無いやーんｗ。というか、PHP関連案件自体が少ない上に、ほぼほぼ「Laravel」になってるやーん。浦島太郎み強すぎやがな。

Googleトレンドで調べてみたら、どうやらワイがVRを始めた2017年頃に、ちょうど入れ替わりでLaravelが大躍進、対比してCakePHPは下がって行ってたんやなあ。諸行無常感。

今更RustやGoを使ってどうこうはちょっと無いし、PythonはAI筆頭に各種専門家のお手軽ITツールになってるし、ReactやNext.jsはフロントエンドでお作法程度には使うにしても、やっぱメインはビジネスアプリ系のバックエンド＋同期型フロントエンドをやりたいんやで、って事で、取りあえず現実認識としてPHPで続けるならLaravelやらんとなんよなあ。

＊Unity案件もあったらなあと探してるけどゲーム関連ばっかで、ビジネスアプリでっていうのはさすがに全然無いんよなあ。個人的にはWebGLメインにこの辺の可能性を今後探っていきたいところ。

ということで、今年に入ってLaravel習得でチュートリアルをちょこちょこイジり始めたが、やっぱサービスを自作せんと身に付かんなあと、サイトリニューアル計画発動。

フリーのテンプレートからええ感じのを探して拝借して、Bladeで組み付けて、実装機能の検討、サイト公開に関するLaravelの設定やら調べて、Git使った運用モデルを策定、途中、サーバ要件でPHPのデグレとかを挟みつつ、CMSとしての各種機能を実装、で、ようやく当初予定の最低限の機能が揃って公開に至りましたよと。

開発の経緯や機能実装等はまた追々。取りあえずようやくで開設できました。

BOOBY AND BOOTYでは、主にPHPでのWebアプリ開発を承っています。お仕事関連の情報ページも（近々）作成予定です。
前のWPでいつの間にか消えてたお問い合わせフォームは、今回デザインテンプレートからしっかり入っていますので、お仕事の相談やお問い合わせがありましたらお気軽にどうぞ。

Copyright © BOOBY AND BOOTY 2024