以下に、
DesignOps に関するよくある質問 (FAQ) とトラブルシューティングを紹介します。
テクニカルフォーラムでスレッドを開始すれば、チームから回答を差し上げます。エラーの詳細と、問題の再現方法をできるだけ詳しくご説明ください。インポートダイアログにエラーが表示されているときにエラー表示のアイコン (
) をクリックすると、エラーのトレースを取得できます。また、再現に使用できる最低限の
デザインファイル (可能であれば .gxsketch または URL) を提供していただけると参考になります。
必要に応じて
サポートチームにもお問い合わせください。
最近のブラウザーでは
.ttc (
TrueType Collection) や
.otc (
OpenType Collection) のファイル形式はサポートされていません。このため、デザイナーはデザインファイルでこれらのファイル形式を使用しないことをお勧めします。これらのファイル形式は (その名前から分かるように)、
.ttf (
TypeTrue 形式) または
.otf (
OpenType 形式) のフォントファイルを 1 つのファイルにまとめたものですが、ほとんどのソフトウェアと同様に利用規約 (利用許諾契約、EULA) の対象であり、利用が許可されている必要があります。.ttc または .otc のフォントファイルがあり、利用が許可されている場合、個々の .ttf ファイルまたは .otf ファイルを取り出す必要があります (
transfonter などのオンラインサービスを利用可能)。それらを次のいずれかの方法で GeneXus にインポートします:
- デザインファイル内で .ttc ファイルまたは .otc ファイルを、対応する .ttf ファイルまたは .otf ファイルに置き換える。 [ 推奨 ]
- デザインファイルと同じ場所に、デザインファイル名に接尾語「Fonts」を付けてフォルダを作成し、すべての .ttf または .otf をそこに置く。
たとえば、デザインファイルの名前が「My Design.gxsketch」の場合、「My DesignFonts」というフォルダを作成し (スペースは必要)、.ttf または .otf をそこに置いてから、デザインファイルをインポートします。
ㅤ
ほかのツールからデザインをエクスポートして変換できます (例: Figma、Adobe XD、Lunacy から Sketch 形式に変換)。ただし、注意が必要です。変換プロセスには、最終的な結果に直接影響を及ぼす不整合または不備がある場合があります。そういった理由から、エクスポートおよび変換を行ったデザインを適切なツールで開き (例: .xd から .sketch に変換する場合は、その .sketch ファイルを Sketch で開く)、すべての内容が想定どおりに描画され、構造化されていることを確認することを強くお勧めします (シンボル、スタイル、色の変数、アンカーなど)。また、GeneXus にインポートする際に必要なすべてのリソース (フォントやエクスポートされた画像など) がファイル自体に含まれていない場合がある点に注意してください。そのため、まず
デザインのエクスポートの記事をよく読むことをお勧めします。
GeneXus でサポートされている形式にデザインを変換するにあたりサポートが必要な場合は、
Unanimo.Design までお問い合わせください。
GeneXus 17 Upgrade 7 以降では可能です。ただし、URL がアクセス可能であり、ファイルが強制的にダウンロードされる必要があります。つまり、デザインの URL をブラウザーに貼り付けた際に、GeneXus Design Inspector でのみ機能し、自動でダウンロードが開始する必要があります (リダイレクト、認証などは発生しないこと)。TravelAgencySample.sketch の例を見てみましょう:
| 原因 |
デザインのインポートオプションは、できる限り GeneXus でデザインを再現しようとしますが、それが可能かどうかはデザインファイルが十分に整理されているかどうかによります。いくつかのシナリオを 1 つずつ分析する必要があります。 |
| 解決方法 |
最初に、デザインファイルが、適切な結果を得るためのデザイナー向けガイドラインに従っていることを確認します。これだけでは不十分である場合は、デザインを GeneXus でモデル化できるかどうかを検討します。できない場合は、開発者はカスタムソリューション (ユーザーコントロールなど) を実装し、デザインファイルからインポートしたものと統合する必要があります。GeneXus でシナリオをモデリングできると考えられるもののインポート中に生成されなかった場合は、想定される結果を実現するために手動で追加します。具体的なシナリオについてサポートにお問い合わせいただければ、今後のリリースで GeneXus オブジェクトを自動生成できるよう検討します。
|
| 原因 |
複雑なコントロールには複雑な処理が求められます。GeneXus にはデザインについての制約があります。
|
| 解決方法 |
デザインはシンプルにします。デザインに複雑なコントロールを含める理由がある場合は (ステッパーなど)、開発者に伝え、手動での実装を依頼します。カレンダー、グラフ、マップなどの複雑なコントロールは「エクスポート可能」とマークし、画像として表示することで、開発者が容易に置換できるようにします。
|
| 原因 |
デザインのインポートオプションでは変更はマージされず、常に過去の内容がオーバーライドされます。
|
| 解決方法 |
手動でマージします。作成済みのものがオーバーライドされないように、インポートを行う前に新しい Theme オブジェクトの名前を指定し、オブジェクトをモジュールにパッケージ化することを強くお勧めします。その後、差分を確認してマージしてください。
|
| 原因 |
デザインがインポートのガイドラインに従っていない可能性があります。
|
| 解決方法 |
最初に、インポートのガイドや表記規則をデザイナーと確認します。適切なテーブルコンテナを生成するためには、まとめるべきものをデザイナーがグループ化する必要があります。問題が解決しない場合は、サポートにお問い合わせください。
|
| 原因 |
黒い画像は、適切な画像がデザインファイルに含まれていない場合に表示されるプレースホルダーです。
|
| 解決方法 |
画像がデザインファイルに含まれていることを確認します。含まれている場合は、その画像に必要な密度 (@2x、@3x、@4x) が揃っていることを確認します。不足がある場合はデザイナーにエクスポートを依頼します。また、複雑な図形 (カスタムアイコンやロゴなど) が「エクスポート可能」とマークされていたかどうかを確認します。問題が解決しない場合は、サポートにお問い合わせください。
|
| 原因 |
デザインファイルには、アプリケーションをレスポンシブにするための情報が含まれていません。
|
| 解決方法 |
コントロールの位置やサイズが固定になっているかどうかをデザイナーに確認します。結果のパネルがレスポンシブになるかどうかをテストするには、そのパネルをモデル化したアートボードのサイズを変更してみます。
|
| 原因 |
インポートプロセスでは、デザイナーがアプリケーションのデザイン時にスタイルを使用しない限り、デザイナーが描画するコントロールごとにスタイルクラスが生成されます。
|
| 解決方法 |
スタイルクラスを再利用するには、デザイナーがスタイルを使用する必要があります。現在 GeneXus では、塗りつぶし、境界線、テキストの各スタイルがサポートされています。
|
| 原因 |
GeneXus は常に各プラットフォームの標準デザインガイドラインに従います (Android のマテリアルデザイン、Apple のヒューマン インターフェース ガイドライン (HIG) など)。このため、デザインと最終結果、またプラットフォーム間で違いが生じる場合があります。
|
| 解決方法 |
プラットフォームのデザインガイドラインに従うことをお勧めします。ガイドラインに従わない必要がある場合は、カスタムソリューションを開発し、デザインファイルからインポートされたオブジェクトに統合する必要があります。
|
| 原因 |
そのフォントがインポート時に含まれていなかったか、フォントのソースがサポートされていません (例: 可変フォント .woff2 やフォントコレクション .ttc)。
|
| 解決方法 |
フォントがナレッジベース内で File オブジェクトとして作成されているかどうかを確認します。作成されている場合は、フォントが含まれる File オブジェクトを参照する Theme オブジェクトに Font ノードがあるかどうかを確認します。最後に、Font ノードがターゲットのスタイルクラスから参照されているかどうかを確認します。問題が解決しない場合は、問題を再現できるようデザインファイルとフォントファイルをお送りください。
|
| 原因 |
デザインファイルで定義されている色変数は、GeneXus 17 Upgrade 1 以降でサポートされます。
|
| 解決方法 |
これらの色を手動で含めて、スタイルクラスから色への参照を更新するか、GeneXus 17 Upgrade 1 にアップグレードします。
|
| 原因 |
既知の問題です。デザイナーがテキストエレメントで大文字や改行を組み合わせると、変数の初期値を設定するときにエラーが発生します。
|
| 解決方法 |
回避策として、デザイナーはテキストを大文字で記述するか、改行を削除する必要があります。この問題は今後のリリースで修正される予定です。
|
| 原因 |
ターゲット画像が見つかりません。通常、この問題は、デザイナーがレイヤーを「エクスポート可能」とマークすることを忘れたことを示します (アイコン、ロゴなど)。
|
| 解決方法 |
デザイナーに、メッセージが示すレイヤーをエクスポート可能とマークするように伝えます。
|
| 原因 |
「%1」に表示されるファイルパスが存在しないか、パスにスペースが含まれている可能性があります。Mac ターミナルからコマンドを実行してみてください。ファイルパスをコピーするときに一部のフォルダが英語以外の言語に翻訳される場合があります。
|
| 解決方法 |
「%1」のファイルパスが存在し、すべて英語で、スペースが含まれていないことを確認します。
|
| 原因 |
デザインファイルのインポート後、作成される各テーマクラスは、タイプに応じて特定の親クラスを継承します (ExternalDesignAttribute、ExternalDesignTable、ExternalDesignTextBlock など)。しかし、モバイルと Web の両方のデザインファイルを同じナレッジベースにインポートすると、階層構造で不整合が生じる可能性があります。たとえば、一部のクラスが意図せずにモバイルクラスではなく Web クラスを継承するか、その逆になる可能性があります。
|
| 解決方法 |
1 つ目のインポート後、生成されたルートのテーマクラスの名前をすべて変更してから (「ExternalDesignAttribute」から「ExternalDesignAttributeMobile」など)、2 つ目のデザインファイルをインポートします。
|
| 原因 |
GeneXus では、Attribute スタイルクラスでも、TextBlock タイプクラスでも、テキスト内の色付き部分の文字列がサポートされていません。
|
| 解決方法 |
デザインでテキストレイヤーを分割して複数の Attribute/TextBlock にし、それぞれに適切な色のテーマクラスを指定します。別の方法として、デザインを GeneXus にインポートした後、 [ Format ] プロパティを HTML に設定し、部分文字列に <span style="color:{色の 16 進表記};"></span> を追加することでテキストの書式を再設定できます。
|
| 原因 |
モバイルアプリケーションをデザインするとき、GeneXus では、ボックスシャドウの定義からマテリアルデザインのエレベーションを推論しようとします。このマッピングは近似であるため、定義が正しくなかった場合に失敗する可能性があります。
|
| 解決方法 |
Sketch を使用している場合、モバイル向けシャドウの設計では、YitingLiu による Elevation-Shadows Sketch 拡張を使用することをお勧めします。この拡張により、ボックスシャドウを適切にマテリアルデザインのエレベーションにマッピングできます。
|
| 原因 |
現時点では、GeneXus は、デザインで指定したグリッドアイテムのスタイルの変更に対応していません。
|
| 解決方法 |
スタイルは Theme オブジェクトまたは Design System オブジェクトで手動で作成し、セルごとにグリッドの Load イベントで関連付ける必要があります。
|
| 原因 |
GeneXus 17 Upgrade 6 以降では、デザイン インポート ツールで既定で Design System オブジェクトが生成されます。
|
| 解決方法 |
Theme オブジェクトを生成する必要がある場合は、GeneXus のインストールフォルダの下に ImportDesignStyleOption.flag ファイルを作成する必要があります。GeneXus を再び開くと、デザインのインポートダイアログに [ デザインシステムとしてインポート ] オプションが表示されます。既定でオンになっているため、オフにしてからデザインをインポートします。デザインのインポートツールから Theme オブジェクトを生成する機能は今後維持されず、サポートされなくなる点に注意してください。
|
| 原因 |
GeneXus が [ インポート ] ダイアログの [ ファイルパス ] フィールドで指定された Sketch ファイルを見つけることができませんでした。
|
| 解決方法 |
このエラーは、複数の状況で発生することがあります:
● 指定したファイルパスがファイルシステム内に存在しない
● ファイルパスが .sketchcloud ファイルで生成された .gxsketch である (GeneXus 17 Upgrade 6 以降でサポート)
|
| 原因 |
インポートダイアログではインポート済みのファイルパスが新しいものから 5 つ保存され、最新のものをロードしようとしますが、そのファイルが既にファイルシステムに存在していません。
|
| 解決方法 |
インポートダイアログの開始前に、指定したパスにファイルを再作成してください。このエラーは、GeneXus 17 Upgrade 7 以降で修正されています。
|
| 原因 |
GeneXus では、すべての画像が Image オブジェクトとしてインポートされ、 [ Rendering Mode ] プロパティの値が Automatic に設定されます。
|
| 解決方法 |
Image オブジェクトを開き、すべての画像のバリエーションについて、 [ Rendering Mode ] プロパティの値を Original に変更します。
|
| 原因 |
[ gx-content-mode ] プロパティ (Design System オブジェクト) も [ Scale Type ] プロパティ (Theme オブジェクト) も、画像変数ではなく画像コントロールに適用されます。インポートによってこれらのプロパティに適切な値が設定された場合でも、画像コントロールは生成されず、画像変数が生成されます。
|
|
| 解決方法 |
CSS の object-fit プロパティを使用し、 [ gx-content-mode ] プロパティ (または [ Scale Type ] プロパティ) の値を次のようにマッピングします:
| fill-keeping-aspect |
→ |
cover |
| fill |
→ |
fill |
| fit |
→ |
contain |
| tile |
→ |
object-fit ではサポート対象外 |
|
|
| 原因 |
デザインでリンク/操作が定義されていますが、お使いの GeneXus Upgrade ではそれがサポートされていません
|
| 解決方法 |
GeneXus インストールをアップグレードし、デザインのインポートを再実行することを検討してください。GeneXus を更新しても問題が解決しない場合は、サポートチームにお問い合わせください。
いずれにしろ、デザイン インポート ツールによって生成された .gxml ファイルおよび .code.gxml ファイル (場所: <ナレッジベースのディレクトリー>/DATA001/DesignToGxml) を調査することで、どのリンクがサポートされていないかを確認し、デザインファイルからそれを削除できます (デザイナーのサポートが必要)。最後に、デザインを正常にインポートしたら、操作を実装できます。
|
| 原因 |
デザインで Figma が提供するフォントを使用しており、そのフォントが Google のリポジトリで見つからないか、そのフォントがカスタムフォントである可能性があります。
|
| 解決方法 |
デザインをインポートする前に、フォントファイルを取得し、開発マシンですべてのユーザーに対してインストールする必要があります。Windows では、フォントファイルを右クリックして [ すべてのユーザーに対してインストール ] を選択します。
|
| 原因 |
GeneXus が認識しないサポート対象外の機能を使用している可能性があります (カスタムの図形や描画、外部ファイル、ライブラリなど)。
|
| 解決方法 |
カスタムの図形や描画を使用している場合は、それらを意味的にグループ化し、グループを画像としてエクスポートできるようにする必要があります。一方、外部ファイルまたはライブラリを使用している場合は、すべてのコンポーネントを外部リソースから切り離し、デザイン内に複製する必要があります。
|
| 原因 |
デザイン インポート ツールがプロパティ {0} の値 {1} を認識していません。これは、Figma でドキュメント化されておらず、インポートツールが処理方法を理解できないためです。
|
| 解決方法 |
このようなエラーは、オンデマンドで修正されます。サポートチームに連絡して、エラーメッセージと、問題を再現するための最小限の例を伝えてください。
GeneXus 18 Upgrade 1 以降、これらのエラーは警告として扱われ、レイヤー全体が無視されます。
|
| 原因 |
これは GeneXus 18 Upgrade 3 までの既知の問題です。
|
| 解決方法 |
手動で「overflow: auto」プロパティを持つテキスト セル クラスを作成するか、GeneXus 18 Upgrade 4 にアップグレードします。
|
テキストがセルにクリップされるか、改行されて表示される。
| 原因 |
デザイナーが、テキストが途切れることなく表示されるようにし、クリッピングや改行 (特にアセンダラインやディセンダラインによる) を防ぐために、縦や横の十分な余白を確保せずにテキストボックスを定義した可能性があります。さらに、font-size と line-height がテキストボックスの高さを超えないようにし、モバイルアプリケーション用にデザインする場合はタッチターゲットの値をチェックすることが不可欠です。
|
| 解決方法 |
適切なスペースとフォントサイズにし、モバイルデザインのタッチターゲットの値を尊重します。
|