TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Show HN: NeedleDrop – Guess the movie from a song

92 点作者 wernah大约 1 年前
Backstory: I&#x27;m a product designer who&#x27;s mostly worked for startups and now big tech, and I haven&#x27;t really touched html&#x2F;css for nearly a decade. I&#x27;ve worked closely with engineers my entire career but never really rolled the sleeves up and dived into a scripting language. I&#x27;d seen some engineers playing around with CodeGPT over a year ago when it launched–we huddled around a screen and tried to decide how quickly our jobs would be replaced by this new technology. At the time, we weren’t in any real danger, but I caught a glimpse of how well it understood prompts and stubbed out large amounts of code.<p>For the past four or five years, I&#x27;ve played a hacky trivia game with family and friends where I play a song, and they have to guess the movie that features the song; Guess the Needle Drop. After many passionate debates and over-the-top celebrations fueled by my generation’s nostalgia for popular classic songs and films, people often told me that I needed to “build an app for this.”<p>I started doodling in Figma before quickly starting to build the website in Node, and then read somewhere that it&#x27;s a better approach to learn vanilla javascript before trying to benefit from frameworks like React, etc. So I started again with a static vanilla website and, piece by piece, built out each chunk of functionality I’d envisioned. My mind was consistently blown at how helpful ChatGPT was–far beyond my lofty expectations, even with all the AI hype. It was like having a 24&#x2F;7 personal tutor for free. I rarely had to google console errors hoping that a Stack Overflow discussion catered to my exact scenario. With enough information, ChatGPT always knew what was wrong and explained in terms I could understand.<p>The workflow went like this: I would describe the desired user experience, parse the code GPT suggested, copy it to my editor, and paste back any errors I came across along the way. The errors were abundant at the beginning, but I got better over time at anticipating issues. Perhaps my biggest takeaway was that I had to learn how to converse with ChatGPT: sometimes I would spend 10 minutes crafting a prompt, forcing me to fully understand and articulate my own line of thinking about what I was trying to achieve .<p>Using ChatGPT to make a static local website is fairly trivial, but the deployment and automation stage is where I fully realised the scope of what I could achieve. As a product designer, I’ve had the luxury of listening to engineers discuss solutions without personally having to sweat the execution. Working solo I couldn’t stay in the periphery anymore. I kinda knew AWS was a whole thing. That git was non-negotiable. That having a staging server is sensible and that APIs could do a lot of the heavy lifting for me. I would sanity-check with ChatGPT whether I understood these tools correctly and whether it was appropriate to use them for what I was building. A few of the things that initially intimidated me but I ended up working out:<p>- GitHub Actions workflows<p>- AWS hosting and CloudFront<p>- Route 53 DNS hosting<p>- SSL certificates<p>- Implementing fuzzy search<p>- LocalStorage and JSON manipulation<p>- Even some basic python to scrub data<p>It’s a fairly basic game, and for anyone sneaking a look with the inspector, it’s a dog’s div soup breakfast served with a side of spaghetti logic. But it still goes to show how much AI seems like a learning steroid.

38 条评论

hiccuphippo大约 1 年前
&gt; sometimes I would spend 10 minutes crafting a prompt, forcing me to fully understand and articulate my own line of thinking about what I was trying to achieve<p>Yes, usually called rubberducking. Trying to explain a problem to someone else can lead you to the answer. Many times I&#x27;ve found the answer to something while trying to write the question in StackOverflow.
评论 #39606932 未加载
评论 #39611045 未加载
seandavidfisher大约 1 年前
Love the idea and execution. The spinning record was fun and gave me something to watch while racking my brain. Have you considered adding an “I have no idea” button? I ended up just typing random movies, but having the UI guide the user in some way when they honestly can’t think of a likely movie would be thoughtful.
评论 #39609622 未加载
评论 #39609697 未加载
looperhacks大约 1 年前
Congrats! The game is quite hard because there might be multiple correct solutions, but only one gets accepted. But I understand that this is a limitation of the game, maybe adding something like &quot;Correct, but we&#x27;re looking for something else&quot; would be nice.<p>Two suggestion for improvements:<p>- Add a skip button. If I don&#x27;t have a clue which film it might be, I need to write some nonsense answer to get a clue, a skip button would be nicer. - Play the song immediately when I click the play button. I was wondering why it doesn&#x27;t start, even though I clicked the Play button!<p>Sidenote: I spoiled myself because Imagus showed me the movie pictures in the archive ;) Not your fault of course, but I found it funny
WirelessGigabit大约 1 年前
I worked with a colleague who didn&#x27;t write JS for a long while. My colleague purposefully tried to build the project with the output of ChatGPT.<p>One of the problems my colleague ran into is that once things don&#x27;t work as expected, debugging is really hard. When you build a system yourself you have a knowledge foundation, and a process that you repeat over and over. They are intrinsic to your development process. They allow you to quickly debug problems. But not so much when dealing with this kind of generated code. Much more often did we have to resort in peeling back the layers and realize something a couple of layers down was wrong.<p>One example is that the generated code does not contain take age of the code into account. So all of the sudden you&#x27;re mixing ESM and non-ESM packages and you get the weirdest errors.<p>&gt; sometimes I would spend 10 minutes crafting a prompt, forcing me to fully understand and articulate my own line of thinking about what I was trying to achieve .<p>The reality is that this is one of the reasons why I actually love coding. As someone who has many times unconsciously said the wrong things and pissed off people (sorry!), using a limited grammar to express my wants feels so much safer. The grammar is limited. It is extremely explicit. There is no ambiguity. And bar a few esoteric languages, there are no emojis, and there is no need for me to be polite or offer a tip.
评论 #39607526 未加载
halfmatthalfcat大约 1 年前
What does it say about me if I instantly thought of Anthony Fantano when reading the title?
评论 #39609487 未加载
xd1936大约 1 年前
I know that &quot;Beverly Hills Ninja&quot; with Chris Farley features &quot;Low Rider&quot; by War, but it wasn&#x27;t a correct answer :(
评论 #39608326 未加载
评论 #39608086 未加载
评论 #39608303 未加载
评论 #39608452 未加载
评论 #39608786 未加载
AdamTReineke大约 1 年前
Make sure you know the cost to serve that 2MB MP3, especially if you&#x27;re go viral.
评论 #39606854 未加载
gknoy大约 1 年前
I have no comments on the JS, but this is a neat idea for a game, and fun to play. Thank you for making and sharing it! :)
javier_e06大约 1 年前
Arrgh. I suck at this. I was put against a bad movie from 2000. 24 Years ago with a song from 1975 that is way better than the movie. I watched the original at a the matinee. I love the car-wash scene. I&#x27;ll watch the movie again tonight <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=Le_SnbrNaog" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=Le_SnbrNaog</a>
gknoy大约 1 年前
One thing that would be convenient would be a link to the previous &#x2F; next song in the game. I found myself linking the archive page to friends, and while convenient, that isn&#x27;t as compelling as your clear call to action on the normal play page. :)
评论 #39607257 未加载
tudorw大约 1 年前
Claude 3 seems much better than GPT4 at Python as of yesterday&#x27;ish, it&#x27;s better at longer contexts (pasted 900 lines for example) and just a little better at organising and planning code. so much fun! Also getting fast!
krumpet大约 1 年前
I&#x27;ve always considered Stack Overflow research to be very valuable. Less for the answer to my question and more for the related topics, edge cases, and other details that frequently are included in thorough answers &#x2F; comments &#x2F; discussions.<p>When AI answers your question (and only your question), that&#x27;s great for that specific instance, but it feels to me like it&#x27;s lacking in breadth. I wonder if that results in the user becoming really, really reliant on said AI as they don&#x27;t fully grasp the interconnectedness of coding? Just a thought.
评论 #39607885 未加载
atleastoptimal大约 1 年前
You should ideally find songs that are only used in one movie, or perhaps specific versions of songs, like the Spanish version of &quot;hotel California&quot; in Big Lebowski
groggo大约 1 年前
Wappalyzer extension says it&#x27;s using Firebase, are you? If so, why mixing it with all the AWS stuff? I&#x27;ve been using Firebase for quick mini-projects and it&#x27;s fun and quick it is for prototyping. If you use it for hosting, no worries about Cloudfront, routing, SSL, or anything... it even automates the github CI&#x2F;CD.<p>How did you like using vanilla JS? What sort of build tool did you use?
评论 #39607493 未加载
plorntus大约 1 年前
Out of interest how did you get the rights to stream the music? Cool game just curious if itl stick around.<p>I would definitely like some sort of “decade” option if at all possible so you can stick to films of a certain era. Some of the older ones I had no ability to guess (which is fine, just would like to weed those out for my own fun).<p>Also as others stated, some made for the movie tracks would be nice!
kfichter大约 1 年前
A few different movies have this song in it, would be cool to accept any of the correct answers, depending on how easy that is.
评论 #39607071 未加载
评论 #39607022 未加载
评论 #39607562 未加载
评论 #39607053 未加载
WesleyJohnson大约 1 年前
Congrats on shipping! I enjoyed today&#x27;s puzzle; love that movie. I found myself wanting to stop the song while I typed my answer, because it was a bit distracting. But I guess that&#x27;s part of the game, right? If you stopped the song, you could &quot;think on it&quot; for minutes before typing your answer.<p>Fun concept.
评论 #39606995 未加载
lelandfe大约 1 年前
Congrats - works and looks good.<p>It&#x27;s worth noting AI&#x27;s current limitation for sites: pretty poor accessibility. Consider adding some &quot;screen reader hidden&quot; text for the menu link, and try using the interface with your keyboard (tabbing around). Happy to go into more detail if you want, or email in bio.
评论 #39607267 未加载
jayturley大约 1 年前
Might want to add the year to the movie titles in the autocomplete. In today&#x27;s puzzle, the title for both the 60s movie and the 2000s movie show up in the list and there&#x27;s no way to differentiate them other than guessing. I guessed wrong.<p>Other than that, lovely idea and implementation!
aabhay大约 1 年前
What do you think is the realistic ceiling of using an AI agent helper? Like when do you feel like you would “graduate” from the agent and just have enough skills to want to read documentation yourself, etc.? Or would you always imagine yourself using AI as a permanent coding tool?
评论 #39606958 未加载
评论 #39607361 未加载
mr_sturd大约 1 年前
This is great. I used to play this sort of game with friends, with our phones on a Bluetooth speaker.<p>I was on my last go when the screenshot gave it away for me. There were two options available in the search, but it seems I guessed correctly!
davisp大约 1 年前
One more feature request is a “share score” text. Daily games like these are popular for bragging rights in group texts.<p>I’d think something like percentage of song played before correct with total number of guessed would cover it.
评论 #39612460 未加载
jay_kyburz大约 1 年前
I think if you are going to do this you need to do songs that were written for a movie. You can&#x27;t play a Where is my Mind then ask somebody what movie its from. It&#x27;s in _a lot_ of movies.
评论 #39609706 未加载
tamimio大约 1 年前
In addition to “no clue” button, it would be nice to have some sort of incentive if you answered it fast, say I found out in the first 5sec then X, but if you do after 30sec then XY.
steezeburger大约 1 年前
Today&#x27;s song is in 2 movies, and I technically got it correct the first time, but the app counted it wrong.<p>Edit: it&#x27;s actually in several movies. At least 4. All quite iconic imo.
评论 #39607503 未加载
silisili大约 1 年前
Nice site but small usability complaint: on mobile web, the on screen keyboard blocks the suggestion dropdown, so I had to keep closing my keyboard to select a movie.
LVB大约 1 年前
Small bug: for today&#x27;s (3&#x2F;5) puzzle, the autocomplete lists two of the same correct answer (identical text). The first one is a win, the second a loss.
jebarker大约 1 年前
I really like this. One bug I hit on duckduckgo browser: after closing the tab for the site the music continued to play until I killed the browser entirely
turtlebits大约 1 年前
Great concept - please add keyboard control, especially on that typeahead&#x2F;autocomplete dropdown and form submission. (super frustrating to have to click)
评论 #39608649 未加载
jihadjihad大约 1 年前
If you click and drag near the text under the clapperboard, you can see a frame from the film, which might help you guess the answer.
评论 #39608840 未加载
LVB大约 1 年前
Well done! I love the idea and interface. The movie selection fit me too (some hard, some guessable quickly, all things I’ve seen).
derN3rd大约 1 年前
Reminds me of Bandle (bandle.app) where you are guessing the song by listening to parts of a song (drums, then drums+base etc)
erybodyknows大约 1 年前
Congrats on shipping. Do you have a write up with more detail on your approach to coding using ChatGPT?
评论 #39606910 未加载
ian0大约 1 年前
Congrats! Its lovely, especially like the transition after you submit the answer.
gardenhedge大约 1 年前
How does the description (on HN) not mention Wordle?
评论 #39609688 未加载
ashfernandez大约 1 年前
What editor were you using to compile code?
ashfernandez大约 1 年前
Super cool.. will def be using it for fun.
xrd大约 1 年前
Another similar site is cinequote.net