Mobile App Design Process
description
Transcript of Mobile App Design Process
![Page 2: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/2.jpg)
UPLOAD IMAGE FILES
CMS app
(From Gallery, URL, Camera or Dropbox).
.JPG .PNG.GIF
Creating an Image Selector for a CMS.
Load from URL flowCreating an Image Selector for a CMS. 1.
Mobile Version
.JPG
![Page 3: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/3.jpg)
Creating an Image Selector for a CMS.
Creating an Image Selector for a CMS. 2.
Mobile Version
UPLOAD IMAGE FILES FROM:
.JPG .PNG.GIF
GALLERY
CMS app
CAMERA
URL
DROPBOX
![Page 4: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/4.jpg)
Creating an Image Selector for a CMS.
Creating an Image Selector for a CMS. 3.
Mobile Version
Image URL
Paste URL here…
CMS app
Image Preview
![Page 5: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/5.jpg)
Creating an Image Selector for a CMS.
Creating an Image Selector for a CMS. 4.
Mobile Version
Image URL
http://www.liferay.com/logo.jpg
OKCMS app
Image Uploaded! Image Uploaded!
![Page 6: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/6.jpg)
— The Process —
![Page 7: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/7.jpg)
6Step 2. WireframingPaper & Pencil
![Page 8: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/8.jpg)
6Step 1. Information Architecture
Moleskine/Sharpies/HB pencil
![Page 9: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/9.jpg)
Step 3. Visual DesignPhotoshop & Sketch
6
![Page 10: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/10.jpg)
Step 4. PrototypingMarvel/Invission/ or so…
6
![Page 11: Mobile App Design Process](https://reader031.fdocuments.us/reader031/viewer/2022020211/57906d501a28ab68748f751a/html5/thumbnails/11.jpg)
6Step 5. TesrtingMobile Phone/Devices & Desktop