字幕组成品列表（Beta）
  • 写在前面
  • Android 平台
    • Game On! 游戏开发系列 - 031
      • Pie Noon - 1503060393
      • The Death of Base Game Activity - 1504030543
      • Surviving OpenGL Context Loss - 1504030546
      • WebP for Game Devs - 1504030547
      • Saved Games In-Depth (Part 1) - 1504070556
      • Saved Games In-Depth (Part 2) - 1504030548
      • Smaller Flipbook Textures with CRABBY - 1504030544
      • Google Tag Manager - 1504030545
      • Flatbuffers - 1505050794
      • Achievement Point Pointers - 1505050796
      • Frequency Scaling - 1505050797
      • Meet the Management APIs - 1501140367
      • Y U Ship Broken Games - 1505050795
    • Android 性能优化 - 088
      • Garbage Collection in Android - 1503170425
      • Performance Cost of Memory Leaks - 1503170424
      • Rendering Performance 101 - 1501130351
      • Understanding Overdraw - 1501130352
      • Understanding VSYNC - 1501130353
      • Tool - Profile GPU Rendering - 1501130354
      • Why 60fps? - 1501130355
      • Android UI and the GPU - 1501130356
      • Invalidations, Layouts, and Performance - 1501130357
      • Overdraw, Cliprect, QuickReject - 1501130358
      • Tool - Memory Monitor - 1501130363
      • Battery Performance 101 - 1501130364
      • Understanding Battery Drain on Android - 1501130365
      • Battery Drain and WakeLocks - 1501130366
      • Memory Performance 101 - 1504170661
    • I/O 2014 Android 开发专题 - 089
      • Activity Transitions - 1504020505
      • Building Apps For Android TV - 1504020520
      • Building great Android media experiences - 1504020510
      • Building a quality app from start to finish - 1504020515
      • App Indexing API - 1504020507
      • What's new in WebView - 1504010484
      • Bluetooth Low Energy - 1504010486
      • Building impressive Android media experiences - 1504010493
      • The next Generation of Authentication - 1504020497
      • Don't Alpha That Pixel! - 1504020523
      • NFC + HCE Your phone in an interactive world - 1504020509
      • Demystifying encodes and decodes of WebM - 1504020521
      • Google Cloud Messaging - 1504020524
      • Getting your Game on the Big Screen - 1504020518
      • I hear you like realtime memes - 1504020511
      • Offerize your App - 1504020506
      • Using the Android Job Scheduler - 1504020504
      • From Holo to Material - 1504020526
      • Under the Hood of Android Auto - 1504020501
      • Isolation for Android App Developers - 1504020498
      • Android Work - 1504010496
      • ExoPlayer: Adaptive video streaming on Android - 1504010489
      • Sample rates and resampling: Why can't we all just agree? - 1504010488
      • Drive Android API - 1504010485
    • Android Studio - 004
      • Layout Editor (Ep 3, Android Studio) - 1503290479
      • Introducing Gradle (Ep 2, Android Studio) - 1503170426
    • I/O 2014 Android 分发主题 - 091
      • Introduction to Google Play - 1504030534
      • Google Play: building your user community - 1504030535
      • Optimizing Apps for Education - 1504030536
      • Succeeding in Education Technology - 1504030530
      • Subscriptions Made Easy with Google Play - 1504030531
      • The world is your playground - go global with Google - 1504030533
      • Maximizing discoverability on Google Play - 1504030538
    • Android Auto - 003
      • Introduction to Android Auto - 1504130615
      • Android Auto Messaging - 1504130617
      • Android Auto Audio - 1504130616
    • Android Wear - 006
      • Designing for Android Wear - 1503210448
      • How We Customized Google Apps for Android Wear - 1503210450
      • Fullscreen apps for Android Wear - 1503210445
      • New Notification Features for Android Wear - 1503210446
      • Building Cloud-powered wearable Apps - 1503210449
      • An Introduction to Android Wear - 1503190435
      • Google I/O 2014 - Android Wear: The developer's perspective - 1503210442
      • Devoxx 2014 Interviews: Android Wear - 1503210440
      • DevBytes: Watch Faces for Android Wear - 1503210439
    • Android TV - 005
      • Using the Leanback library - 1504080588
      • Beach Buggy Racing Multiplayer with Nearby Connections (Play Services) - 1503060387
    • Android for Work - 106
      • Android for Work for Developers - 1503060390
      • App Configurations, Testing and Launchers - 1504110590
    • IO Bytes 2014 - Android - 066
      • Chrome Apps on Android and iOS - 1501080014
      • Perf Primer CPU, GPU and your Android game - 1501080017
  • Chrome 平台
    • IO Bytes 2014 - Chrome and Web - 067
      • Using the PageSpeed API - 1505070815
      • Fabulous Forms for the multi-device web - 1505070816
      • Testing multi-screen web pages - 1505070817
      • Responsive images today - 1505070819
      • Web Performance Testing at YouTube - 1505070828
      • Building sites for the multi-device web - 1505070820
      • Deep dive: Google Cloud Messaging for Chrome - 1505070827
  • Google 创业者资源
    • Coffee with a Googler - 012
      • Chat with Allen Huang of AndroidTV - 1503040384
      • Chat with Fred Chung about developer advocacy - 1503070395
      • Google Fit platform with Michelle Haq - 1503210443
      • Android Auto Product Manager Andrew Brenner - 1501120027
      • Chat with Francis Ma about Google Play services - 1501120028
    • Root Access For Startups - 077
      • What we learned building plug-ins for Android, with startup Magnet - 1503230453
      • How to use crowdfunding to your advantage, with startup Hale Devices - 1503280462
      • How to overcome customer objections when selling tech, with startup Guesswork - 1503280458
    • First Things First - 029
      • Getting started with Android: A crash-course in developing for Android - 1504120601
      • How to ask a question: conducting research for your startup - 1504120603
      • MVP Design Hacks: transform your hot idea into a validated prototype - 1504120602
      • Build something people want: Solving real problems - 1504120605
    • How I - 061
      • Use BigQuery to find my most valuable customers - 1504070573
      • Manage beta testing communities using Google Play - 1504070572
      • Use paper wireframing to build native prototypes - 1504070570
      • Used social media and $0 marketing to get 68 million users - 1504070568
      • Prep to fundraise with four questions - 1504070564
      • Validated my idea in 2 days (with no code) - 1504070562
      • Build open platforms on Android - 1504120596
      • Get cheap, automatic analytics for my business using BigQuery - 1504070571
      • Write press releases to get international media coverage - 1504070569
      • Test beta-product features using Google Apps - 1504070563
      • Use URL builder to measure ROI on social media - 1504070561
      • Use events to build DeadSocial's brand - 1504070557
      • Use BigQuery to visualize streaming data - 1503220452
      • Find, screen, and hire developers - 1503120406
      • Drive engagement with social challenges - 1504070558
  • 设计
    • DesignBytes - 017
      • Paper and Ink: The Materials that Matter - 1505050793
  • 云计算
    • DevBytes: Google Cloud Platform - 021
      • Powering the next killer app with the Google Cloud Platform - 1504210672
      • Introduction to Google Cloud Endpoints - 1504210675
      • The Beauty of Scale with Google Cloud Platform - 1504210678
    • Google Cloud Platform - Big Data - 105
      • GDELT & BigQuery: Understand the world - 1502200379
    • Uncategorized - 999
      • Introducing Google Cloud Platform Resources - 1501190370
  • Google 应用开发
    • Launchpad Online - 072
      • The Setup: Creating new apps using Google APIs - 1503190428
      • Listing your files in Google Drive - 1503190429
      • Customizing Google Analytics for your startup - 1503290473
      • The Launchpad Online series - 1503190427
      • Getting started with Google Analytics - 1503290472
      • Accessing Google Maps from a spreadsheet?!? - 1502220381
      • Change the world in 10 lines of code - 1503080398
    • Google Play Services - 054
      • Google Play services 6.1 - 1503290481
      • Google Play Services 7.0 - 1503200437
      • Google Play Services 6.5 - 1501080015
    • 谷歌地图 iOS SDK - 053
      • Maps Live: New Features in the Google Maps Mobile APIs for Android and iOS - 1504300777
    • Google 移动搜索开发 - 055
      • Is your app in the Google index? - 1504120598
      • Get more engaged users with Google Search for Developers - 1503070397
    • DevBytes: Google Cast - 020
      • Google Cast SDK for Android - 1504180666
      • Media Router Framework - Part 1 - Media Router API - 1504180667
      • Overview for Google Cast Receivers - 1504180664
      • Google Cast SDK for iOS - 1504180663
    • Getting Started with the Google Maps SDK for iOS - 035
      • Getting started with the Google Maps SDK for iOS, Part 1 - 1504270757
    • IO Bytes 2014 - Wearables - 070
      • Voice Driven GDK Glassware - 1505280836
    • Route 85 - 078
      • Introducing Route 85 - 1501120022
      • Quick Tip: Don't Default that Switch! - 1501190371
      • OpenInChrome on iOS, Part 1 - 1501120023
      • OpenInChrome on iOS, Part 2 - 1501120024
      • OpenInChrome on iOS, Part 3 - 1501120025
      • OpenInChrome on iOS, Part 4 - 1501120026
    • DevBytes 2014 - 019
      • Web Components - Template - 1505040789
      • Wearable DataLayer API - 1505050792
      • Using srcset for responsive images - 1505050790
      • The picture element for art direction - 1505050791
    • Uncategorized - 999
      • Sun Surveyor brings augmented reality to photographers using Google Maps APIs - 1504200668
      • Snappy travels with the Roads API - 1503060392
      • Easy Maps Apps in Java and Python - 1501140030
  • Google 广告平台
  • Polymer
    • Polycasts - 076
      • The Awesome Power of Auto-Binding Templates -- Polycasts #08 - 1502220382
      • Content Switcheroo with Core-Pages -- Polycasts #09 - 1502200380
      • Core Iconset -- Polycasts #02 - 1505040788
  • Web 平台
    • HTTP 203 - 062
      • Gotchas - 1501140368
      • Font Rendering - 1501080016
    • Web Components - 081
      • DevBytes: Web Components - Overview - 1504250709
  • 宣传视频
    • Uncategorized - 999
      • Google Developers - 1501150369
      • I/O Extended 2014 - Join me - 1502220383
  • Google 各类开发者会议
    • 2014 Chrome 开发者高峰会议 - 009
      • Keynote - Chrome Dev Summit 2014 (Darin Fisher) - 1503120407
      • TLS All the Things! - Security with Performance(Chris Palmer) - 1503140412
      • Let’s build some apps with Polymer!(Rob Dodson) - 1503150415
      • Day One Closing Remarks(Sundar Pichai) - 1503150417
      • Chrome Leadership panel - 1503160422
      • Fundamentals of Mobile Web Development(Matt Gaunt) - 1503150416
    • 2015 游戏开发者大会中 - 039
      • FlatBuffers - 1504150640
      • Games for Google Cast - 1504150637
      • Top 10 Things Android Game Developers Should Know v 3.0 - 1504150643
      • Automate Publishing for Google Play APIs - 1504150639
      • 3 Game Design Mistakes You're Making - 1504150636
      • Android TV - 1504150638
      • How to Go Viral Without Really Trying - 1504150641
    • Devoxx 2014 Interviews - 024
      • What's new in Android 5.0 Lollipop - 1504260740
      • Android Tools - 1504260743
      • BigQuery and user-defined functions - 1504260744
    • IO Bytes 2014 - 065
      • Dart in Google Cloud - 1505070810
      • Big genomic data on Google Cloud Platform - 1505070811
      • Easy International Checkout with Chrome - 1505070802
      • Google developer tools and APIs for iOS - 1503190436
      • Whet your appetite with IO Bytes - 1501080021
    • PlayTime@Shanghai - 095
      • 主题演讲 Chris Yerga - 1504060549
      • 如何成功地开发你的应用 Ellie Powers - 1504060550
      • 在Google上营利 Brahim Elbouchikhi - 1504060551
      • Playtime Shanghai event sizzle reel - 1504070552
    • Project Google I/O 2015 - 098
      • Project Tango Mobile 3D tracking and perception - 1506120857
      • Democratizing Education - 1506120868
      • Improve your Android app’s accessibility - 1506120864
      • Google Cloud Messaging 3.0 - 1506120844
      • Developers connecting the world through Google Play - 1506120862
  • 开源开放技术
    • Compressor Head - 013
      • The Trailer, Season 2 - 1503060385
      • Behind the Scenes - 1503210441
      • Arithmetic Compression (Ep 5, Compressor Head) Google - 1503070394
      • Introducing Compressor Head - 1502120372
      • Episode 1 (Variable Length Codes) - 1502120373
      • Episode 2 (The LZ77 Compression Family) - 1502120374
      • Episode 3 (Markov Chain Compression) - 1502120375
Powered by GitBook
On this page
  • 译者信息
  • 解说词中文版：

Was this helpful?

  1. Google 创业者资源
  2. How I - 061

Use paper wireframing to build native prototypes - 1504070570

PreviousManage beta testing communities using Google Play - 1504070572NextUsed social media and $0 marketing to get 68 million users - 1504070568

Last updated 5 years ago

Was this helpful?

视频发布时间

2014年12月17日

视频介绍

The Novoda team explains how they build clickable, native prototypes using paper wireframing to test their designs, get feedback faster, rapidly iterate, and save time.

视频推介语

暂无，待补充。

译者信息

翻译

润稿

终审

原始链接

中文字幕

翻译流水号

加入字幕组

Martin

點墨

--

1504070570

解说词中文版：

DAVE CLEMENTS: Hi 我是Dave Clements Novoda设计部负责人

DAVID GONZALEZ: Hi 我是David Gonzalez

Novoda的技术产品负责人

Novoda是一个软件开发平台 专门针对Android

我们在伦敦 柏林都有公司

很快在纽约也会有了

我们今天将演示如何用手写线框图

来构建一个原生app模型

DAVE CLEMENTS：最初的时候 我们始于一个

将会与客户讨论的想法

梳理一下人物 故事 等等

分解功能列表并开始绘画

我们在草稿本上作画 同时要保持简洁与快速

这样我们就可以通过这些快速迭代并用

这些图片建立用户体验 我们也可以把这些

发给客户并进行深入的探讨

好的

我从一个简单的屏幕开始画起

首先整体布局一番

这里是一个系统栏和导航栏

是的 刚开始只需要涂鸦了一些基本信息即可

放一些标签在这里

然后我们在这块儿区域放图片

也许这只是一张几比特的图片

差不多就这么简单 很粗略 不用浪费很多时间

我也许会在这里或那里临时加上一点东西

例如用毛刷笔来让这些看起来更有深度

这样客户就知道它们的层次是怎样

这样客户就知道它们的层次是怎样

好的

现在 我们拿刚才画出来的图纸

把图像抠出来 然后放在桌子上

接下来团队里的设计师 开发者等相关人员坐在一块

把这些东西在页面中移来移去

把界面重叠起来以联想出

我们觉得足够好的

可以呈献给客户的用户体验界面

我们向他们发送界面布局并等待反馈

我们现在有了切出来的纸片

或者说页面 屏幕 不论你怎么叫它们

我们不用思考 好吧 我们需要创建用户体验流程

从第一个界面开始 DAVID GONZALEZ: 我们有第一个

这是第一个界面 对吧

DAVE CLEMENTS: 我们也许需要一个导航抽屉

我们知道这将要划出来划进去

所以如果你不介意的话 我们把它拿出来

DAVID GONZALEZ: 是的 看看这样就好些了

看起来很好是吧

对吧

DAVE CLEMENTS: 对吧

看起来棒棒哒

DAVID GONZALEZ: 我喜欢

DAVE CLEMENTS: 下一页 我们把它滚动到这里

DAVID GONZALEZ: 在这里我们接下来怎么做呢

我们有这个

DAVE CLEMENTS: 这代表我们能够向上滑

然后标题消失

标签锁定

接下来 我们点进 假如是这个

这个在我们正在做的事情中并不重要

但是重要的是我们正在演示这个用户体验流程

所以接下来我们会说 我们能点击这个区域吗

接下来弹出了这个

一旦我们将这些布局好了 我们就决定好了

好吧我们不需要这个 但是这就是全部的用户体验流程

我们只是简单地使界面模型化

接下来我们会把这些上传到Basecamp或者是JIRA

客户可以从那里获取到这些东西

接下来 我们就可以进行更深入的开发

创建更多的用户逻辑流 等等

但是这才是最基础的

DAVID GONZALEZ: 第三阶段 我们要建立一个模型

我们已经从之前切出来的图片中获得

所有的这些设计和资源

我们将把它们放到一个原生app里

所以我们将创建一个客户可以使用的真正的app

客户将会使用

并把玩它们

他们将会在内部决定是否喜欢它

如果他们不喜欢 那我们只好再做一遍

是的 现在我们会做的就是当

我们把这些图片放到Basecamp或者是JIRA上的时候

我们会把这些放到一个非常简单的布局里面

现在我们有一个FrameLayout

我们另外要做的就是inflate它

然后从标题中获得一些东西

比如图片 照片和文字

然后很简单地把它显示出来 就是把它放在那里

你可以看到 你可以快速显示一张图片

并看到它在app中看起来如何

所以现在是 我们所看到的是

这个案例中app的第一个界面

这是一个非常简单的登陆和[听不清]

你可以看到这个例子中

这只是非常简单的布局 用来显示FrameLayout中的按钮

每一个控件都有监听器

这是一个很简单的草图UI

在这里案例中 当我们点击登陆界面

不 是点击登陆按钮 我们将进入一个我们刚看过的

文章列表

我们要做的就是这样

当用户点击了列表中的一个选项

它将进入文章界面

文章则是个单一的fragment

包含图片和文字的一个简单的布局

你还可以在这个案例中看到

这只是一个ScrollView中的LinearLayout

里面有两项内容 也就是两个FrameLayout

也就是图像和文字

现在 我们基本创建完成整个UI了

所以现在我们唯一需要做的就是建立一个工程

编译生成APK文件 就可以安装使用了

这允许我们与客户有快速的交互

并使整个过程快速迭代

这将为我们节约很多

开发和绘画的时间

这也将是这个项目的一个更好的结果

Youtube
Youtube
加入 GDG 字幕组
video_screenshot