The Reveal!

See Colleen's product! Video at https://youtu.be/vdO7uFT63dw

TRANSCRIPT

Michele Hansen  0:00 
We're doing something a little bit different. Colleen's product is ready to have a little walkthrough of it. So this will be the first time I'm seeing it. So we're doing something different. This week's episode is going to be a podcast as normal, but it is also going to be a video. So you can see what Colleen's product looks like. So hopefully this is just as enjoyable as whether you're listening to the podcast, or you're watching the video, we'll put a link to the YouTube video in the shownotes. Definitely let us know what you think of the format. And hopefully, it's interesting. 

Colleen Schnettler  0:49  
Okay, this is great. I'm super pumped to show you this. Michele, I'm going to share my screen with you so you can see it. Alright, can you see my screen? Yes. All right. So let's start from what the very beginning kind of what I'm trying to accomplish here. So this window right here that says new listing details, let's say this is your existing user interface. So your user is adding listings for I don't know, an event or a real estate site or something like that. So what you a typical kind of quick, easy implementation is just your typical HTML file tag, which is what you have right here. Now, I have found this to be like, really ugly, and I just don't care for it the way it looks. And plus, even if you're importing a file, this way, you still are responsible for setting up your cloud storage account, as we've talked about ad infinitum I know, but basically, you still have to get all the other back end stuff set up. So what you do is you would go to Heroku, you'd provision my application, and then you'd sign on to my application. And I would give you this script, like so basically, and I have not finished or like really worked out the documentation yet. But basically, I'm going to have a site, like once you've signed up for my application that says, Put this script in the head of your file of your website. So then you add this script to your site, save it, I'm running this locally, so we could see the changes kind of as they're happening. And now you get something like this. So Oh, thanks.

Michele Hansen  2:29  
Well, there's a drop file.

Colleen Schnettler  2:31  
Now there's a drop file, boxy

Michele Hansen  2:33  
way of having, right.

Colleen Schnettler  2:35  
So and I think one of the things that's really important here is I think, Heroku, I could be wrong, but like, it's mostly like Node and Rails developers. So there's people that are more focused on the back end. So anything I can do to make the UI less painful for you, is what I want to do. So So I worked for an events company at one time, so we had to deal with tons of images. And we implemented a drop zone like this, but we had so many problems with users trying to drop files that were too big files of the incorrect, you know, format, things like that. So what this does for you is if I wanted to drop some images, so if I try to drop a file, right now, I want to say I have a two Meg limit. And I'm probably going to change that I haven't worked out that detail yet. Let's say I have a two Meg limit. So if you try to drop a file that's bigger than two Meg's you're going to get this exe. And it's going to tell you the files too big. And then it's going to remove the file from the drop zone. So your user can drop a new file.

Michele Hansen  3:36  
Ah.

Colleen Schnettler  3:38  
okay. So I mean, even that I have a lot of like thoughts about like, right now you drop it, you and it's a timeout, like, I don't know if I should wait and let the user exit out. Or, you know how

Unknown Speaker  3:51  
little

Michele Hansen  3:52  
quick I didn't get to fully read read it the text until the second time. You did it, because you

Colleen Schnettler  3:59  
need to look for it the second time. Yeah, I

Michele Hansen  4:02  
didn't really know what was going to happen. But I knew there was some errors. So yeah, I would probably try to upload it twice just to see what that error was.

Colleen Schnettler  4:13  
Okay, that's good feedback. And again, I can slow it down. I mean, maybe I should slow it down a little bit.

Michele Hansen  4:20  
I also wonder about accessibility for that.

Colleen Schnettler  4:24  
Right. That is an excellent point. I will look into that, because that's definitely something I need to address. That's a really good point. So that's kind of what I have now. And those are two good comments for a bad file. But what I really have gone back and forth, and left and right about is what about a good file. So let's drop a good file in here. And so there's all kinds of things I can do here and I'm probably just overthinking it, but like how opinion Am I going to be like that little green checkmark? Should that stay? Should I go? Should I keep the reason I kept I went back and forth on keeping this dashed blue line. And the reason I kept it was to show you if you change your mind, you can just drop a new file in there, right? You can,

Michele Hansen  5:18  
yeah. And I guess, to me, a dashed line around the image implies that it's in a draft state and that they need to do something else in order for that to be saved.

Colleen Schnettler  5:29  
Okay, that is what you think. Okay. Yeah, cuz I went back and forth on that. Like, should I read, because what I had originally, is I actually removed the drop zone and just put the image on the page. But when I removed the job zone, I then had to add a button so that they could bring the drop zone back up. So it started to get more complicated.

Michele Hansen  5:53  
And I noticed that it shows the file size, even when the file size is an acceptable size. Yes, you walk me through why that is?

Colleen Schnettler  6:03  
I think that's partially like, you know, when I started this, I was just trying to kind of keep track. So I would know immediately, like, Oh, this one is one fits, this one doesn't fit. But I, you know, have no strong opinions about whether that's helpful or whether the user even cares, which probably they don't care, right. They just want to know if it's successful or not.

Michele Hansen  6:28  
Yeah, I, I would be curious to I mean, maybe there are people who get value out of that, maybe I won't discount that.

Colleen Schnettler  6:36  
So I was showing this to a friend of mine. And he has a few apps on Heroku. And he suggested accepting other file types. Because his point was, if you have a really image heavy site, you're probably already using one of the big players in the image, site market. But there's a huge problem with like, if you want to email someone a PDF, or, you know, you're collecting resumes, or all the other kinds of file types that people might want to upload. So that kind of gets interesting, because then I was thinking, Okay, let's say we want I have a PDF here for my children's school, welcome newsletter. So if I try to drop a PDF, that works, but I don't ever have any kind of preview image. So you think that I mean, should I just leave it like that? You have thoughts on that?

Michele Hansen  7:24  
Is there some sort of icon you can use for the image or file type like,

Colleen Schnettler  7:30  
like a PDF icon? Yeah, that's a good idea. pdf. And maybe like, same thing for like a Word document or something like that.
...