これは、iDBアプリの設計・開発を手がけたイタリアのスタジオ、Belkaの誇り高きデザイナー兼CEO、ジュリオ・ミケロン氏によるゲスト投稿です。ミケロン氏に、iDBアプリの開発初期段階から最終製品に至るまでの経験を語っていただきました。パート1は先週公開、パート3は来週公開予定です。
前回のパートでは、基本的なアイデアやコンセプトを反復するローファイデザインについて説明しました。今回は、ハイファイデザインと製品の実際の実装についてお話します。
ローファイからピクセルパーフェクトへ
セバスチャンとアプリの仕組みについて話し合った後、見た目も魅力的にする必要がありました。私たちはシンプルで洗練されたデザインが好きなので、様々な提案を繰り返し検討し、最終的に最適なものを選びました。
優勝したバージョンは見つかりましたか？おそらく見つかりません。ここにはありませんから！
ご覧のとおり、高レベル設計は非常に要求が厳しく、いくつかの選択肢がありました。ピクセルパーフェクト設計と低レベル設計の主な違いは次のとおりです。
- 低レベルの設計では、取り組むべき問題はユーザビリティですが、これは通常、他のほとんどのアプリで既に定義されています。
- 高レベルのデザインには好みが絡んでくるため、通常はより困難になります。この問題に取り組むために、私たちは幅広い選択肢から始めました。
Sebastien と色、他のアプリのスタイルなどについて調整や話し合いを行った結果、カード レイアウトの洗練された明確なバージョンが完成しました。
ほぼ最終版
このバージョンからの開発中にカードのレイアウトが再度調整されましたが、ほぼ最終形になっています。
視覚的に美しく、読みやすい結果を得るために、Article ビューでも同じ手順を踏みました。
設計から動作するコードまで
設計部分が完了したら、Xcode を開いて、StackOverflow のタブを開き、開発者の帽子をかぶる時間です。
このアプリの最大の課題はスワイプジェスチャーでした。見た目はシンプルで良いのですが、実際にはこの機能一つで開発全体の40%を占めています。iOSのアニメーションは非常に難しく、セバスチャンは私たちに完璧さを求めていました。
実装前にスワイプジェスチャーを設計しませんでした。代わりに、Tinderカードのアニメーションを期待される結果として使用することにしました。最終的な結果は以下の通りです。
もう一つ注目すべき機能は、WordPressとの連携です。iDownloadBlog.comはWordPressをベースに構築されており、ウェブサイトの著者が同じインターフェースから記事を執筆・投稿できるように、既存のデータベースと連携させる必要がありました。WordPressダッシュボードには一切手を加えず、著者にとって使いやすいように配慮しました。
おそらく皆さんのほとんどは開発者ではないので、実装の詳細を説明して皆さんを退屈させたくはありません。その代わりに、アプリに関するいくつかの雑学をお話しします。
- このアプリには98個の機能が実装されています。多いように聞こえますか？比較的シンプルなアプリであることを考えると、これは興味深い点です。
- iDB アプリには、なんと 8,020 行のコードが含まれています。
- ルカ（リードiOSエンジニア）が開発中に最も多く摂取した食べ物はカネデルリでした。これは彼の脳が高品質なコードを生み出すのに役立っています。その効果については、次の点をご覧ください。
- アプリは最初の3週間、99.6%のクラッシュが発生していません。Canederliは素晴らしいです。クラッシュを経験した0.4%のユーザーには申し訳ありません。現在、皆様のために作業を進めています。
- このアプリは、フェラーリのように、すべてイタリアで手作りされています。
iDBアプリの開発方法については、今回の投稿はこれで終わりです。次回（そして最終回）では、Apple Watchアプリとその秘密についてご紹介します。お楽しみに！
高レベルのインターフェース設計や開発についてご質問がございましたら、お気軽にお問い合わせください。
