正在加载视频...

视频加载失败

I built this little app visualiser using Argent (by Software Mansion). If you're building a complex app it's very useful to preview routes, screens and build a mental model of navigation. Here's it is with Bluesky already loaded in

84,275 次观看 • 2 个月前 •via X (Twitter)

38 条评论

Alex Mikucki 的头像
Alex Mikucki2 个月前

Preview screen states, tap targets for specific navigation actions, use a live loaded simulator session (not mock data) Claude build an .appmap format for you with the included skill.

Alex Mikucki 的头像
Alex Mikucki2 个月前

Should we build mobbin but with app maps for popular apps? Or maybe you want live preview what your agent is up to with a UI like that?

Alex Mikucki 的头像
Alex Mikucki2 个月前

Here's the repo: If you're using @expo-router or @reactnavigation it can additionally parse your code to make sure it tries to get to every route possible.

Alex Mikucki 的头像
Alex Mikucki2 个月前

@reactnavigation Also shipped visual PR reviews:

Michał Pierzchała 的头像
Michał Pierzchała2 个月前

@swmansion I think @tryrevyl did it first with their Atlas, it’s free to use

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion @tryrevyl doesn’t seem free (think you get 5h for free) but does look similar!

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion @tryrevyl ofc that includes agent access in their case so not that bad, but I’m sure there’s a market for a self hosted/run on your own CI version of it

Revyl 的头像
Revyl2 个月前

@thymikee @swmansion Open source

Mike 的头像
Mike2 个月前

@aleqsio @thymikee @swmansion Can we use this with Agent Device? This is cool!

Michał Pierzchała 的头像
Michał Pierzchała2 个月前

@tryrevyl @aleqsio @swmansion I’ll let someone build it

Gabriel Moncha 的头像
Gabriel Moncha2 个月前

@swmansion oh my god!

Thibault Malbranche 的头像
Thibault Malbranche2 个月前

@swmansion Looks sick ! First thing that made me think of was that

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion Yes, think there's two natural directions of this: previewing changes visually (map + usage video) and teaching agents UX patterns

Thibault Malbranche 的头像
Thibault Malbranche2 个月前

@swmansion Are you planning on iterating on it ?

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion Yes, thinking of at least exploring these two directions, also open for more ideas or collabing!

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion Here's the demo for diffs!

Rami Maalouf 的头像
Rami Maalouf2 个月前

@swmansion needed this

Jake 的头像
Jake2 个月前

@swmansion Seems great, but I have to upload my proprietary code to a website? Not comfortable with that

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion fair, it’s client side only so you can run it in offline mode, run from the repo etc

Meltohamy 𓂆 的头像
Meltohamy 𓂆2 个月前

@swmansion That looks awesome? Does it work with all routers ?

Alex Mikucki 的头像
Alex Mikucki2 个月前

@swmansion It’s mostly an agent tapping through your app, so I hope it can work even with binaries once physical device control for ios ships with argent.

Meltohamy 𓂆 的头像
Meltohamy 𓂆2 个月前

@swmansion That would be really helpful, thank you for sharing

Shahar Nechmad 的头像
Shahar Nechmad2 个月前

@swmansion Lokos awesome! Seeing the whole navigation map visually is super useful. Does it detect conditional/deep links too, or only the routes it can see statically?

Alex Mikucki 的头像
Alex Mikucki2 个月前

the static routes are there to help agent make sure he visits as much as he can, it’s able to detect routes, states etc. (and you can always prompt it if it misses something) also it builds Argent flows so it can rescreenshot things reliably without burning tokens next time you change something

aniol 的头像
aniol2 个月前

@swmansion very cool

Felipe Veiga 的头像
Felipe Veiga2 个月前

@swmansion Amazing, thanks for sharing!

AI Mastery Guide 的头像
AI Mastery Guide2 个月前

@swmansion visualizing the whole navigation flow like that is really handy

Shen Long 的头像
Shen Long2 个月前

@swmansion super cool!

Adithya 的头像
Adithya2 个月前

@swmansion Yo 🤘 Awesome work, man 👏 I am building something similar as well

Clifford Fajardo 的头像
Clifford Fajardo2 个月前

@swmansion really cool! I love argent, now this takes it to another level with its figma like canvas loading your resl app data 🤯🤘

Pasty NFTs 的头像
Pasty NFTs2 个月前

@swmansion mental model lifesaver

Bouchaib ENNAKR 的头像
Bouchaib ENNAKR1 个月前

@swmansion it's open sourced or not yet ?

403access 的头像
403access2 个月前

@swmansion that's dope

Kenneth Yiu 的头像
Kenneth Yiu2 个月前

@swmansion Will try this out. Super cool

Bouchaib ENNAKR 的头像
Bouchaib ENNAKR1 个月前

@swmansion Is it based only on a static analyzer ? Is all of that done in a single run? just one prompt and then wait for the result?

Bouchaib ENNAKR 的头像
Bouchaib ENNAKR1 个月前

@swmansion Does it cover all states for all screens?

Jamie Birch 的头像
Jamie Birch2 个月前

@swmansion That’s real nice 🤤

Nekena Rayane 的头像
Nekena Rayane2 个月前

@swmansion So the app runs, and an agent navigates through it? How do we manage environments—like, when we're communicating with multiple services?

相关视频