水曜日, 12月 17, 2025

Let's enjoy affinity 02 
対応するファイル形式とカラーモード

気になるファイル形式とカラーモードを調べて見ました。

affinity by Canva

ファイル形式は[ファイル]>[エクスポート]>[書き出し]で表示されるオプションパレットの左端で選択出来ます。

細かく調べると上の様になっていました。
読み込みだけにしか対応していないファイル形式についても以下に整理してみました。

■Affinity ネイティブ形式
.afdesign(Designer) 
.afphoto(Photo) 
.aftemplate(テンプレート) 

■ラスタ/画像系
BMP(読み込み) 
JPEG / JPG 
PNG 
GIF 
TIFF 
WebP 
RAW(デジカメなど) 
HEIF/HEIC/HIF 
OpenEXR(.exr) 
Radiance HDR 
TGA 
JPEG-XR / JXR(WDP / HDP) 

■ベクター系
SVG(読み込み・書き出し) 
EPS(読み込み・書き出し) 
DWG / DXF(CAD形式の読み込み) 

■ドキュメント系
PDF(読み込み・書き出し) 
Microsoft Word(DOCX, RTF)との配置(Publisher) 
Microsoft Excel(XLSX, スプレッドシート)配置(Publisher) 
Adobe Illustrator(.ai)読み込み・配置 
Adobe Photoshop(PSD)読み込み・書き出し 
Adobe Freehand(.fh10 / .fh11)読み込み(ページ連結) 
InDesign(IDML)読み込み(Publisher) 

Illustratorの[.ai]形式はAdobeが使用を公開していないので書き出しは出来ません。もしIllustratorにデータを渡す場合は[.svg]で書き出せばIllustratorで読み込むことが出来ます。

細かいファイル形式は、[ドキュメント]>[設定]>[ドキュメント設定]で表示されるオプションパレットの左端で調整出来ます。

オプションパレットの項目は上の様になっています。特に気になるのは[ファイルサイズ][カラーフォーマット][カラープロファイル]は以下の様に対応しています。

[ファイルサイズ]

[カラーフォーマット]

[カラープロファイル]

仕事で使う場合でも特に困ることはないと思います。

affinity for macOS 3.0.1.8308

TCDW8618 
考えたら12月も残り半分切ってますから当然ですね

今まではパーカーの上にジャンバーでしたが、遂に外出時はダウンコート類に切り換えました。車移動の時はVANのスタジアムジャンパー(^o^)考えたら12月も残り半分切ってますから当然ですね。雪はまだ〜?

火曜日, 12月 16, 2025

Let's start JavaScript 91 
HTMLでサムネイル画像切替ギャラリー

HTMLでサムネイル画像切替ギャラリーを作りました。

iindexx.htmlと同じ階層に500×500pxの画像を収めたpicフォルダーを作成しています。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>サムネイル画像切替ギャラリー</title>
<style>
body {
font-family: sans-serif;
margin: 0;
background: #f8f8f8;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.gallery {
display: flex;
align-items: center;
gap: 10px;
background: #fff;
padding: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.main-image {
width: 400px;
height: 400px;
object-fit: cover;
border: 1px solid #ccc;
}
.thumbnails {
display: flex;
flex-direction: column;
gap: 10px;
}
.thumbnails img {
width: 70px;
height: 70px;
object-fit: cover;
border: 2px solid transparent;
cursor: pointer;
transition: border 0.2s;
}
.thumbnails img:hover,
.thumbnails img.active {
border-color: #0078D7; /* 選択時の青枠 */
}
</style>
</head>

<body>
<div class="gallery">
<img id="mainImage" src="pic/pic01.jpg"
        alt="Main" class="main-image">
<div class="thumbnails">
<img src="pic/pic01.jpg" alt="Image1"
class="active" onclick="changeImage(this)">
<img src="pic/pic02.jpg" alt="Image2"
        onclick="changeImage(this)">
<img src="pic/pic03.jpg" alt="Image3"
        onclick="changeImage(this)">
<img src="pic/pic04.jpg" alt="Image4"
        onclick="changeImage(this)">
<img src="pic/pic05.jpg" alt="Image5"
        onclick="changeImage(this)">
</div>
</div>

<script>
function changeImage(thumb) {
// メイン画像の切り替え
document.getElementById("mainImage").src = thumb.src;
// アクティブ枠の更新
document.querySelectorAll(".thumbnails img").
forEach(img => img.classList.remove("active"));
thumb.classList.add("active");
}
</script>
</body>
</html>

実行直後の画面。右端のサムネールをクリックすれば・・・

左に大きく表示されます。

クリック毎に切り替わります。

TCDW8617 
人生はじめて100均で1点買いしました

Baby Alien 172
後頭部をぶつけたティディーベア系(^o^)
カメラリモコン用のボタン電池CR2025が昇天したので予備を装着したら、既に放電していてアウト。電圧が同じCR2032は有るけれど厚みが違うので互換性なし(>_<)。仕方が無いので急いで車出して100均に急行。人生はじめて100均で1点買いしました(^o^)

月曜日, 12月 15, 2025

Photoshopでグラデーション登録手順

質問がありましたので・・・
私はよく使うグラデーションをかなりの数登録しているので、しばらくぶりで勘違いしていたので備忘録をかねて整理してみました。

まずツールパレットのグラデーションを選択したときのオプションパレットのオプションから[新規グラデーションプリセット]を選んでも、既存のグラデーション名変更しかで来ません。かなりイライラいします。

ユーザー定義する場合は[ウィンドウ]>[グラデーション]で表示されるパレットのオプションから[新規グラデーションプリセット]を選びます。

これでグラデーションエディターが表示されます。サムネールバーの下のマークを選択し、カラーの色の部分をクリックすると・・・

カラーピッカーが表示されるので、希望の色を設定します。

コレで色指定は完了です。

反対側も同様に設定します。もちろん色の設定は何カ所も設定可能です。

サムネールバーの上のマークを選択すれば不透明度を調整出来ます。

作り込みが完了したら、[OK]ではなく[新規グラデーション]をクリックします。そうしないと登録することが出来ません。プリセット部分で登録を確認できたら[OK]で登録の完了です。たまに処理すると,最後の最後でうっかり[新規グラデーション]をクリックせずに[OK]をクリックしてしまうことがあります。

登録後の状態です。なお基本に予め登録されているのは左から[描画色-背景色]、[描画色-透明]、[黒-白]です。誤動作?等で削除してしまった場合はオプションから[デフォルトのグラデーションを追加]で読み込むか、再制作しておくと良いでしょう。

TCDW8616 
柿とミカンも良い感じにアタリが続いています

週に2〜3回スーパーでの買い物をするのですが、少し前に書きましたが、今年は台湾パイナップルが店頭にほとんど出ていなくてガッカリしたのですが、リンゴは当たり年でした。一年中バナナとリンゴは毎日食べているので嬉しい展開でした。バナナは常にハズレがないです(^o^)で、今は柿とミカンも良い感じにアタリが続いています。

日曜日, 12月 14, 2025

JavaScriptでAI遊び 81 
Illustratorで塗りと線を分割

選択したオブジェクトの塗りと線を別オブジェクトとして分離します。複合パスにも対応していますが、解除してから処理した方が賢明です。

// 塗りと線を分離して複製(PathItem と CompoundPathItem に対応)

if (app.documents.length === 0) {
alert("ドキュメントが開かれていません。");
}

var doc = app.activeDocument;
var sel = doc.selection;

if (sel.length === 0) {
alert("塗りと線を分離したいオブジェクトを選択してください。");
}

// メイン処理:選択オブジェクトに対して再帰処理
for (var i = sel.length - 1; i >= 0; i--) {
processItem(sel[i]);
}

// 処理対象:PathItem / CompoundPathItem / GroupItem
function processItem(item) {
if (item.typename === "PathItem") {
separateStrokeFill(item);
}
else if (item.typename === "CompoundPathItem") {
// 複合パス内の要素を処理
for (var j = 0; j < item.pathItems.length; j++) {
separateStrokeFill(item.pathItems[j], item); // 複合パス親を渡す
}
item.remove(); // 親の CompoundPathItem を削除
}
else if (item.typename === "GroupItem") {
// グループ内のオブジェクトを再帰処理
for (var k = item.pageItems.length - 1; k >= 0; k--) {
processItem(item.pageItems[k]);
}
item.remove(); // 元のグループも削除
}
}

// 塗りと線を複製・分離する
function separateStrokeFill(pathItem, parentToReplace) {
var hasFill = pathItem.filled;
var hasStroke = pathItem.stroked;

if (!hasFill && !hasStroke) return;

if (hasFill) {
var fillCopy = pathItem.duplicate();
fillCopy.stroked = false;
fillCopy.filled = true;
if (parentToReplace) fillCopy.move(parentToReplace, _
        ElementPlacement.PLACEBEFORE);
}

if (hasStroke) {
var strokeCopy = pathItem.duplicate();
strokeCopy.filled = false;
strokeCopy.stroked = true;
if (parentToReplace) strokeCopy.move(parentToReplace, _
        ElementPlacement.PLACEBEFORE);
}

pathItem.remove();
}

alert("塗りと線を複合パスも含めて分離しました!");

グループ化している場合は解除し、オブジェクトを選択して実行します。

処理後は線だけのオブジェクトの上に塗りのオブジェクトが配置されます。

重なって同じ位置に再描画するので、ずらせばバラバラになって居ることを確認できます。

TCDW8615 
何故か色々壊れたりするんですよね

年末になると、何故か色々壊れたりするんですよね。メーカーの仕様なのではと疑ってしまいます。まっ気のせいでしょうけれど・・・(^o^)

土曜日, 12月 13, 2025

クランプの塩ビ製パーツの代替えはペッとボトルキャップ

クランプの塩ビ製パーツ(※)の代替えはペッとボトルキャップ

※この製品の場合は塩ビでした。

こんな感じで使い物になりません。

ペッとボトルのキャップを上図の左から右のように加工します。
上図の上段は上のパーツ。下段は下のパーツ。

最後にグルーガンで固定して完了です。

TCDW8614 
それを壊す人が出るとメチャクチャ困ります

どんな状況にも一定のリズムがありますが、それを壊す人が出るとメチャクチャ困りますね。リズム感がないというか、空気が読めない人・・・勘弁してほしい。