假iOS UI工具

Question

我正在尝试为 iOS 和 Android 设备组合一个虚假的 UI，而不实际创建所有那些乏味的 UI 工作。 有没有办法以某种方式从图像中模拟 UI？ 到目前为止，我们已经有了 Photoshop 设计和模型。

有工具吗？ 我检查了 Titanium 和 ForgedUI。 虽然它是一个相当简单的概念，但我仍然认为创建所有这些是一种矫枉过正。 例如，我必须为按钮切片我的 PSD。 另外，数据提要必须来自 URL 等。

我只是想要一些类似于 Balsamiq Mockups 的东西，将一个屏幕链接到另一个屏幕，以进行一堆屏幕的实际演示。 我们想在开发准备产品的同时测试导航、字体和产品概念。

提前致谢！

Answer 1

最简单的方法是使用 HTML。 如果您已经有 Photoshop 模型，您可以简单地将它们导出为（视网膜质量）PNG 图像并添加一些图像映射以进行导航。 如果您将此网站添加到您的主屏幕，您将获得像素完美的预览，而无需 Safari 的导航栏。

但是，iOS 应用程序严重依赖动画。 如果您无论如何要使用本机 UI，则应该考虑使用实际的UIControl元素创建“真正的”UI 原型。 虽然这是更多的工作，但它允许更好的 UI 评估。

Answer 2

对于线框图，有几个选项：

1. 对于高保真模型，我会在 Interface Builder 和 storyboard 中进行，就像 JustSid 推荐的那样。 只是不要做连接 UI 元素的乏味工作。

2. 你可以看看像Adobe Proto这样的工具。 我从未尝试过，但似乎它可能是一种选择。

3. 对于我的超快速、低保真模型（例如“信封背面”模型的数字等价物），我个人使用 iPad、 手写笔和Sketchbook Pro 之类的绘图包（使用您想要的任何绘图包，但是我喜欢有层次的）。 我还在 iPad 上放置了空白设备图像。

   所以，我在我的 iPad 上打开我的绘图包，使用 iPhone 设备的图片作为起点开始一个新的绘图，拖到一个新层上（这样我就可以在一个层上绘制并隐藏或丢弃该层以立即回到空白设备图像的图像），然后在这个新层上绘制我希望我的 UI 的样子。 这对于头脑风暴会议非常有用。 从这个概念性的低保真模型到实际的 Xcode 故事板没有自动桥梁，但我可以在几秒钟内绘制一个用户界面模型。 我这样做不仅是为了与设计师进行头脑风暴，也是为了充实我自己的概念，我自己也是。