– DEVICE TESTING – EMULATORS

View Github Repository Open presentation in a new window

priyanka-herur

See all presentation from priyanka-herur

– DEVICE TESTING – EMULATORS

0 0

MetaRefresh2015

Why we came up with our own solution at solving Device Testing, and, how we iteratively improved it, and extended it based on our own usage and customer validation

On Github priyanka-herur / MetaRefresh2015

DEVICE TESTING

EMULATORS

CHROME DEV TOOLS

  • Device Presets- screen size, DPR, User Agent
  • Network connectivity
  • Sensors- Touch screens, accelerometer and geolocation

FIREFOX

SAFARI

LIMITATIONS

  • Hardware: CPU, GPU, Battery, can't be emulated
  • Performance issues due to various reasons
  • User Interactions: Device display for form elements can't be seen
  • General Display: address bar
  • Color Profile
  • Chrome Emulator
  • iPhone

ADOBE SOLUTIONS

DEVICE CENTRAL

  • Emulator with about 200 devices in its repository
  • Opera's Small Screen Rendering
  • Supports content from DW, AI, FW, PS and FL
  • Automation

LIMITATIONS

  • Emulator
  • Up-to-date

EDGE INSPECT

Install, Connect and Preview

Inspect with Weinre

Advantages

  • Screenshots
  • Device Sleep

LIMITATIONS

  • Not Native Browser
  • Multiple installations

SYNC PREVIEW

Browser-based solution

Log into browsers for testing

Use the same ID on all the devices

Enter URL

Preview

Device Highlight

Inspect using Weinre

Synchronous Scrolling

What next?

Integration with Code Editors

BRACKETS

DREAMWEAVER

1. Connect

2. Preview

3. Synchronous Scroll

  • Testing server is updated automatically
  • Live Edits

PHOTOSHOP

  • Preview Designs - Layer Comps
  • Color Profile

References

priyankaherur.com