カテゴリー
Design Develop

Touch UIとFlashの話

ソシオメディアの上野さんの記事
丁寧に細部まで解説、考察されている非常に良い記事なので、UIデザイン関係者は必読。

この記事を読んで、当時Flasherとして登場時にUIに感じたの影響と、その経緯についていておこうと思います。あまり懐古的にならない、につながる内容にしたいと思いますが、年齢的に無理かもしれません。ご了承ください。

カテゴリー
Develop Works

Shinichi Sato / 佐藤振一 ver.2018

2018-04-03 15.55.15.png

家、佐藤振一氏のポートフォリオサイトを制作させていただきました。

https://satoshinichi.com/

佐藤さんは建築、都市景観を中心に、8×10版や超高画素した、超精緻な描写と独特な空気感を持つ作品を数多く制作されています。
今から10年前に、8×10のポジをはじめて見た時の衝撃は今でも強く覚えています。

「超精緻な迫力、質感が伝わる、上のブック」

このの元、 Flashを用いて初代サイトを制作したのが2008年
当時のでは対応が難しかった表現、機能を駆使したこのサイトは、多くの国内外写真家から問い合わせを頂くなど高い評価を頂きました。

それから10年、状況は大きく変化し、HTML技術も大きく進化しました。
オリンピックが開催される2020年にはFlashの了も決まりました。
これらの状況に対応したサイト継続のために、HTML版へのリニューアルを行いました。

カテゴリー
Develop 未分類

Creative Cloud Librariesを使ってみた

Adobe Stockおよびリンクされたアセットを使用するCreative Cloud Libraries | Adobe Creative Cloudチュートリアル
製品の新機能Creative Cloud Librariesをで使った所感メモ。
結論から言うと、アセットの共有は非常に半端で制作過程における「」目的での使用は難しいレベル。
以下詳細

  • アセットに関して
    • シンボルとの境界が曖昧。位置づけとしてはリンクファイル延長の概念。(的にはシンボル的なものを期待していただけに落胆が大きい。)
    • 変形リセットがない
    • 共通選択ができない
    • 置換がない
    • グラフィックアセット間の入れ子ができない。(入れ子アセットの変更が反映されない。更新ボタンを押しても無理。親のアセットを編集すれば反映される)
    • シンボルに共有アセットを含められない(これはリンクファイルとして考えれば今まで通り)
    • イラレ互換PDFで保存すると共有アセットのリンクが保持されず、保存後再オープンでグラフィックに変換される
  • 文字スルアセット
    • 再編集できない(従来の文字スタイルのようなStudy利用ができない)
  • カラーアセット(塗、線)
    • の変更は可能。ただしスウォッチのようなグローバルカラーを用いた一括管理はできない。

デザインFixしたガイドラインライブラリのような使い方ならいけそうですが、それでも厳格な運用ルールが必要そうな印
のライブラリのような完全な一意性を維持してする形が望ましいのだけど、難しいのかしらねえ・・・。
そもそも「シンボル」自体が半端な昨日なので、そっちをなんとかしてほしかったりする。

カテゴリー
Develop 未分類

movabletypeにSyntaxHighlighterを追加

上に記述されたソースコードを整形、強調表示してくれるJSライブラリSyntaxHighlighterを、MT5にインストール。
MT3の時から利用していたが、しばらくみないうちに連携によるコピペの機能などが割愛され、完全JS駆動になっておりました。(展開などが理由でしょうけど)
で、MT4のプラグイン化されたものがあり、これを使うと記事画面のフォーマットから制御できるらしい。
SyntaxHighlighter for Movable Type | kwLog
そうではあるが、コード部分の定労力が最新版のと大差ない感じだったので、本家の最新版をインストール。
インストールは特に悩むことも無く、JSとを一式アップロード。
利用する言語のブラシJSだけを読み込み処理して、Styleも適当に。
これでわり。
ただなぜか縦スクロールが表示されて不格好な感じになっていたので、CSSを以下のように調整。
これで縦スクロールはでなくなった。(どっかの外人がoverflow-y: hidden !important;だ!とかいていたけど・・)

/* syntaxhighlighter */
.syntaxhighlighter {
margin: -1rem 0 1rem 0 !important;
font-size: 1.4rem !important;
padding: 1rem 0;
}
カテゴリー
Develop Usability

Win8のUI

「Windows 8のUI、ユーザビリティを抑圧」:UI専門家が批判 – CNET Japan
まだ実際にWin8を触っていないので、なんとも言えないですが、いてある内容は事前に得ていたWin8の情報から想像していた印と同じ。
ただこれからどの方向性にシフトしていくか?踏まえると現在は過渡期とも言える状態なわけで、ヤコブ氏の10箇条

  1. システム状態の透過性
  2. システムと実世界の調和
  3. ユーザーコントロールの
  4. 一貫性と標準化
  5. エラー防止
  6. 記憶より認知
  7. 柔軟性と効率性
  8. 美的で最小限のデザイン
  9. ユーザによるエラー認識、診断、回復を援助
  10. ヘルプとドキュメンテーション

を順守していると、ここ数年のスマホ、タブレット出現にともなう劇的な変化スピードについていけず死に絶えるしか無いんじゃないか?という印象です。
じゃあどーすればヤコブ氏に文句言われないのか?っていうと、の名前を継承しないで新しいOSとしてリリースしろってことなんでしょうけど、マーケティング的にWindows名を継承しないデメリットは計り知れないわけで、そういう部分に関しては、こういう時代の変革にはその将来のメリットも踏まえユーザがその二重性に対して納得するかしないか?なんじゃないかしら?とおもいます。
でUIの浸透を済ませ、それをPC側にシフトしていくのやり方は評価すべき戦略ですが、残念ながらはWindows Phoneも後発で、時間が無い。
ユーザビリティ視点で評価するとこういう結果になるのは当然だろうなと思いますけど、世の中はそれだけで成立しているわけでもなく、クジラが5000万年前にやっぱに戻るわって思ったように、その瞬間非効率で、無意味な行為だったとしても、遠い将来生き残るためには必要な行為だったかもしれないことってあるんじゃないかしら?と感じる勤労感謝の翌日であります。
注)ヤコブ氏の分析を否定するわけではなく、それも踏まえてね・・って話です。
あとアマゾンのWin8のサムネイルのカッコ悪さは何とかしてほしいなとも思います。
なんにしても、事務所の新しいWin8が到着しているので、それを触ってみようと思います。
(当然作業用マシンにするか?は要検証・・・)
Ref.
Windows 8 — Disappointing Usability for Both Novice & Power Users (Jakob Nielsen's Alertbox)
Flash critic to coach Macromedia – CNET News

カテゴリー
Develop

GIFアニメの再生速度

実は違う。クロスブラウザでの gif アニメーション再生速度の合わせ方。 (フェンリル | デベロッパーズブログ)
なんとなくうすうすは気づいていたけれど、ここまで詳細に研究しててすごい。
15年ぐらい前、YahooバナーなどがGIFアニメ全盛だった頃に、カラーパレットの調整とあわせて、尺調整もミリ秒単位で作りこんでいたけれど、その時の基準って曖昧だったのだろうか・・・と今更ながら不安になります。(当時はIEぐらいしか対じゃなかったというだけかもしれないですが・・・)
あれから時代はへとシフトし、今hmlt5だとかで再びGIFアニメも復権しているから、このタイミングでのこういう記事なのかもしれませんが、CSS Sorite+CSSアニメ?みたいなシステム必須の形ではなく、ファイルスタンドアローンでのーションフォーマットが出てくれればいいのにとおもいます。(単純にプレイヤーがブラウザの画像レンダーに内蔵されているだけって話ですが)
自分の記憶の中ではPNGのアニメーション形式とか存在してたんですが、どーもだけの対応だったり(PNGアニメ作成法)、PNGを拡張した別フォーマットAPNG(Animated Portable Network Graphics – Wikipedia)だったりしたようです。
一応ソフト(フリーソフトの活用 Paint.NET プラグイン APNG ~アニメーションPNG作成~)も存在しているようですが、未対応ブラウザが多いようであまり現実的ではない感じ。
まぁLZWの特許期間が満了した現在、新しくAPNGに取り組むっつー必要性もないということで、APNGが普及しない2つの理由、2つの望み | YATA BLOGな状況なのでしょう。
ただ的にはフルカラーでのアニメーション画像はやっぱ欲しいし、仕様的にさらにもう一歩踏み込んで、時間軸で変化していないピクセルの情報を割愛した変位部分だけの情報を積層させるような動画的志向をもったフォーマットができたらなぁって思ったりもしします。
ざっくり言うと最コマを基点とした差分情報だけを保持したレイヤーを上方向(時間の若い方)に積層させていくような構造で、時間の進行とともに、上からレイヤーを除去していくようなですけど・・・。(すでにそういう作り方になってるのかもしれんけど)
ということでちょっとメモ

カテゴリー
Develop 未分類

Chrome上でFlashのデバイスフォントが変更できる件

ブラウザ上で標準や言語属性を検証していたところ気づいたのだけど、上の PlayerはフォントがChromeの設定を継承する場合がある。
Chromeの[設定/ウェブコンテンツ/フォントサイズ/フォントをカスタマイズ]の中で[Sans Serif]で定したフォントがFlash Playerのデバイスフォントに継承される。
ただしこの継承が発生するのはChrome専用Playerの特定のジョンの場合っぽい。確認したPlayerは一つ。
[user]\AppData\Local\Google\Chrome\Application\21.0.1180.79\PepperFlash\pepflashplayer.dll
の人でDebug Playerを独自に入れている場合は従来のデバイスフォントで表示される。
ちなみにでは継承は発生せずこれまでどおりのデバイスフォント表示。
PepperFlashってのはChrome V21からのPlayerらしいけど、外サイトを見てるとCPU負荷や日本語入力(ニコ動?)になどがあるっぽい。
ちとこれから先ChromeのFlash Playerが独自の進化をしていくのかよくわからないけれど、デバイスフォントが変更になるのが開発者、ユーザにとってどういう影響を与えるのか見守りたい。

カテゴリー
Develop 未分類

asにjsを埋め込む

よくて過去のリソースを探るので、こっちにメモ

スタンドアロンで検証したい場合は、確かExternalInterface.availableで代替処理を入れてやれば切り分けることも一応できるとおもう。(そのJS内の処理内容によるけれど)
きちんとしてパッケージ化したいと思ったまま5年ぐらい放置・・・汗
はXMLDocumentからXMLに変更になった際にできなくなった気がする。
flex – Flash as3 process XML Doctype Entities – Stack Overflow
回避策はなんとなしにの中にあるのだけど、整理するがないので、備忘録的にメモ
Adobe Flash Platform * XML 変数の初期化
とか使うと連携が楽そう

カテゴリー
Develop

Adobe SWF Investigator

Perform quick, comprehensive, analysis of SWF applications
® SWF Investigator is the only comprehensive, cross-platform, GUI-based set of tools, which enables quality engineers, developers and researchers to quickly analyze SWF files to improve the quality and security of their applications. With SWF Investigator, you can perform both static and dynamic analysis of SWF applications with just one toolset. SWF Investigator lets you quickly inspect every aspect of a SWF file from viewing the individual bits all the way through to dynamically interacting with a running SWF.

Ref.
Adobe SWF Investigator | Flash security – Adobe Labs
Introducing Adobe SWF Investigator | Adobe Developer Connection
Via.Twitter / @otachan: AdobeがSWF解析ツールを公開と。これセキュリテ …

カテゴリー
Develop

Flash Developで2回目以降のコンパイルがエラーになる

の実装環境を設定したら、 Developでコンパイルが出るようになった。
エラーメッセージは

Error: Comparison method violates its general contract!
Build halted with errors (fcsh).

常にという訳ではなく、FDを起動して初回のコンパイルはなくできる。
そのまま修正などして再度コンパイルすると上記のエラーが発生する。
ビルドを[Debug][Release]に切り替えると、エラーは発生しない。
なので、まぁ都度[Debug][Release]を切り替えつつコンパイルすれば対応は出来るのだけど、面倒くさい。同じ問題は発生しているようで、FlashDevelop.org – View topic – Error: Comparison method violates its general contract!にその辺の情報が集まっている。
JDK1.7を入れたことに付随する問題のようだが、Androidの制作環境構築でどこがどうだったかさっぱり思い出せず、Android環境の再構築の手間を考えるとJDK1.7のアンインストールも躊躇してしまう。
色々試しているものの、未だ解決に至らず・・・という状況。