Show HN: MockRocket – 3D app mockups and animations in the browser

[dfeehrer]

Hey HN,

I've spent a lot of time over the years building mockups and demo videos for my apps with tools like Photoshop and After Effects, always frustrated by how tedious it was.

For the past year and a half, I've been working on building a better way.

MockRocket makes it easy to show off your app, right from your web browser–no experience required. Choose a template, drag and drop a screenshot or video and display it on a realistic 3D device model. You can even animate it to create a video.

You can customize as much or as little as you want, and export in up to 4K resolution. All rendering is done in the browser, not on a server–using WebGL and WebAssembly–so your imported designs stay 100% private.

This is the first release! Please let me know if you have any feedback or questions!

[chrisdalke]

I've been following Derek closely as he's been working for the past >1 year to make MockRocket a reality. Congratulations on the launch!

I saw a discussion on HN earlier today criticizing SPAs for offloading data processing to the user's machine, benefiting Facebook/Google/big tech at the expense of the user experience. I think that conversation sometimes misses the positive side of React/client-based apps.

MockRocket and other web-based creative tools demonstrate the strength of the web as an application platform, making complex tools more accessible and easily distributed than before. Derek's built a pretty slick editing & rendering experience that allows more people access to video editing, without having a powerful machine with a GPU. I'm incredibly impressed with the rendering fidelity he's been able to build into MockRocket and excited to play around with it more.

Another great application is https://www.photopea.com/ -- a pretty powerful photoshop competitor that also works exclusively in the browser. Looking forward to seeing more people build and distribute creative/technical tools that more people have access to.

[dfeehrer]

Thanks Chris!

Agreed–data processing on the user's device can certainly be abused in some cases, but when it's used right you can build some pretty amazing experiences with modern web APIs.

Closely following the development of WebGPU as well–I think that's going to enable a whole new class of web apps with serious graphics and compute power.

[dannygarcia]

This is an awesome tool! I created my own promo in Blender for a personal site project* some time ago and it was a real pain getting the screen content to render accurately and contrast well off of the device. Do you have any concerns with consistency across different devices/GPUs since you're doing everything client-side? Nice to see the attention to detail you put into this.

* https://twitter.com/dannygarcia/status/1220401033064484864

[dfeehrer]

Here's my attempt at a quick recreation in MockRocket: https://twitter.com/DerekFeehrer/status/1486471488857378816

Definitely can't compete with those nice photorealistic reflections in Blender, but it's cool to see how close you can get with some of the other aspects in a pretty short amount of time!

2 devices + camera + laptop screen angle + depth of field blur, all animated in the same shot!

[go_prodev]

Nicely done. If that genuinely only took you 25 mins, I'm really impressed

[dfeehrer]

That video–wow! I'd love to try to recreate that in MockRocket and see how close I can get!

There are definitely some trade offs with doing it client side and even some nasty graphics driver bugs across devices (especially Intel integrated GPUs) that have taken quite a lot of work to figure out. For the most part it's worked out though and renders have been pretty consistent, both in my testing and from what customers have shared with me.

I do actually have server rendering built as well, and may enable it down the road for certain use cases, but it's much more expensive, especially because it needs real GPUs on cloud instances and those are obviously in very high demand these days on AWS and GCP.

[lpa22]

This looks simply amazing - I've been looking for an all-in-one way to create beautiful app mockups and noticed how tedious the whole process is so I will definitely be looking into this.

[dfeehrer]

Thanks for the kind words, I really appreciate it! If you have any questions or requests, free to ping me!

[lpa22]

Just purchased the yearly - this was even better than advertised with being able to have video as media in addition to images. This is already better than many of the other options on the market I have tried. Excellent work. One question - I want to share my account login with my business partner, is there a way to share a login?

[dfeehrer]

Thanks so much!

I definitely need to show more examples with videos on the screens.

Currently there's not a great way to share accounts with multiple users other than to buy another account or share your email, but I do plan to add more team collaboration features down the road, especially once I allow people to save projects as templates to use again (soon!).

But if you'd like to change the email on the account to something easier to share we can make that happen, just shoot me an email or chat with the details.

(In the future I may also look at selling these accounts explicitly as limited to a certain number of seats, but for now it's all good if you want to share with your business partner, and you'd be grandfathered in if change things later).

[pabe]

This looks stunning! Some thoughts:

* I cannot buy on mobile ("made for desktop" message). I'll check back on Desktop but not everybody will do.

* It's not clear to me if the launch sale fixes the price "forever" or just for the first year.

[dfeehrer]

Thanks for the feedback!

Yeah I'm still working on figuring out some fallbacks for mobile browsers. It's especially tricky to render videos on mobile, both due to CPU/GPU constraints and due to some missing APIs–even Safari desktop is tough at the moment. But I hear you, I'll try my best to figure out a solution, even if it's just image exports to start.

The sale price does indeed fix the price, it's an 80% discount recurring for as long as you keep the subscription. I'll clarify that!

[pabe]

I'd have bought already if I could checkout on mobile :) I went to pricing, "images & animations" package, "upgrade now" and then I got stopped out because I'm on mobile right now. Therefore, If I were you, I'd focus on getting the checkout to work on mobile.

[bredren]

Cool product. Maybe I missed this, but do you currently or have plans to support video content for display on the devices?

For example, a video screencap of a mobile web page scrolling down. Or the interface changing due to a tap on a button.

[dfeehrer]

Yes, absolutely, you can currently upload videos to display on the screens. MP4, MOV and WEBM files all work!

I’m going to work on clarifying this on the landing page.

[bredren]

That would be good. I did not notice it in the demo video either. This is a big feature so definitely call attention to it!

[fernandorojo]

Agreed, I would put this on the landing page. Was a big sell to me.

[fernandorojo]

I've been using this myself. I'm a fan. I even got the pro tier after using the Figma plugin. Derek has been really helpful too in providing customer service when I hit him up.

[ronyfadel]

The "Introducing MockRocket" looks great. I'm guessing you used a tool such as FCP? I'd love a tool that makes creating such videos easier.

[dfeehrer]

Thanks! Yeah that video was edited in Premiere Pro (and all the shots with mockups were of course rendered in MockRocket). There are actually some features on the roadmap to make it easier to create full product videos like this all from MockRocket!

[jaywalk]

Very cool, and very reasonable pricing. Nice work!

[dfeehrer]

Thanks, glad to hear it!

[CrazyRobot]

This looks great! just what I've been looking for. Will definitely give this a try over the weekend.

[dfeehrer]

Awesome, please let me know what you think when you try it out!

[Zensynthium]

Jeeez this looks amazing! I can't wait to go home and try this!

[sroussey]

Well done!

[dfeehrer]

Thanks!

[dang]

Can you please email [e-mail]? I want to help you with this post.

[Cilvic]

Thanks for the hard work on moderating HN, I appreciate your down-to-earth and transparent approach. Can you share what you guys do to "help with posts"?

[dfeehrer]

Done!