nowfound

Life & fun · September 12, 2017

I reverse engineered the Apple iPhone X landing page

I make people smile. Not by being funny, No, but by crafting applications and interfaces. Here you will find some of my ideas. Enjoy.

I reverse engineered the Apple iPhone X landing page launched on September 12, 2017 with 17 votes, #835 of 3,072 launches that month and more than 75% of that year's launches. The site was still online in September 2026, 9 years on.

In plain words

Anders Åberg shares a reverse-engineered recreation of the Apple iPhone X landing page, demonstrating web design techniques using animated effects and smooth transitions. The project breaks down how visual elements like a moving plasma effect transform and animate as users scroll, combining CSS and JavaScript methods similar to other interactive web experiences. Visitors can inspect the code directly to learn how to implement these slick design patterns themselves.

written from the facts on this page · September 2026

From the sources

Hello fellow kids & developers! I decided to reverse engineer the Apple iPhone X website to learn how their slick “X” landing page is made. By combining a couple of effects it makes for a very powerful end result. Note: It’s similiar to how I did the Avicii True Stories effect. Let’s break the gif down: It starts with an X with a smooth moving plasma. Upon scrolling the X transforms into an iPhone and the plasma remains and becomes the screen. Everything slides in and out in motion. Tight. Fire up your F12 Devtools (by pressing F12 in Chrome) or by right clicking the X and choosing “Inspect”. When peeking at the DOM you will soon see the 3 parts that make up this magic! Okay, so the…from ideasof.andersaberg.com

Does a similar job

all alternatives →
  • Motion Design for iOS2014 · designthencode.com · ▲188

    A book about designing animations for iOS

  • IM
    I'm building a browser for reverse engineers2025 · nullpt.rs · ▲348

    In the expanding world of AI my heart still lies in AST transforms, browser fingerprinting, and anti-bot circumvention. But my workflow felt... primitive.

  • appealing2016 · app-ealing.com · ▲245

    Mobile UI animations found in the wild

  • I made a customizable iOS browser for minimalists and myself2023 · apps.apple.com · ▲226

    Hello HN! So early this year I decided to build an iOS browser offering a large range of customization options, to accommodate anyone’s usage and visual preferences. Been using it as my default browser for 6 months and not looking back. On first launch it looks and behaves a bit like Safari, but to give you an idea, here are the various ways I customized it on my phone. - More screen real estate for the webpage, less for the toolbar. - A compact toolbar containing only the buttons for actions I use the most: new tab, close tab, open tab list. Since I use them hundred times a day, I need them…

  • iPhone X Web-Viewer2017 · test-iphone-x.com · ▲209

    View your website on an iPhone X

  • I reverse engineered top websites to build an animated UI library2025 · reverseui.com · ▲156

    Looking at websites such as Clerk, I began thinking that design engineers might be some kind of wizards. I wanted to understand how they do it, so I started reverse-engineering their components out of curiosity. One thing led to another, and I ended up building a small library of reusable, animated components based on what I found. The library is built in React and Framer Motion. I’d love to hear your feedback

More life & fun this month

the category →

Source: Show HN post ↗

Launched alongside, September 2017

the whole month →
  • A toolkit for makers to ship awesome products ⛵

    Growth · 2017

  • The long awaited version 3 of the popular code editor

    Dev tools · 2017 · sublimetext.com

  • The newest, fastest version of Firefox yet. 🔥🦊

    Life & fun · 2017 · mozilla.org

  • iPhone X▲874

    Apple’s most advanced iPhone yet with a 5.8" OLED display

    Life & fun · 2017 · apple.com

  • The definitive database of YC companies with all the metrics

    Growth · 2017 · ycdb.co

  • A collaborative editor for notes, tasks, and wikis

    Work · 2017 · notion.so