Imitate/Make it my own - DEMO
May 31, 2012
Hi everybody,
This community has inspired me with so many amazing Storyline projects. Thought I would challenge myself to make my own contribution.
My quest: Find an online example. Recreate it with Storyline. Make my own version.
The online example: If I Were President from the New York Times
My recreated version: If I Were President made in Storyline
Making it my own: The Artwork of Patrick Mahoney made in Storyline using the same structure. Shameless plug showcasing my husband's artistic talent.
The most challenging aspect of this project was the smallest element on the page - the next/previous arrows and the variables to display 1 of 12, 2 of 12, etc. Getting the variables just right took some experimentation.
I did not like the hover state in the original project, so I did not carry it over into my version. It seemed like a big distraction and did not add to the project.
Here is the SL file of my version.
Would love your feedback!
Jill
11 Replies
Cool. I like the demo and the way you applied it to your husbands artwork.
Personally, I don't like the way the NYT did the hover. Seems redundant and doesn't add any real value.
Really Nice, I love this type of thing. Your husband is really talented. Thanks for sharing, filed away to use later
Nice job, Jilll! Thanks for posting this - In the artwork demo, I especially love how you made the Selected state on each art thumbnail slightly bigger to show that it is selected ... so subtle but totally effective!
I like the NYT demo too... so cool to be able to use a custom size and make stuff look however you want! One thing I might suggest for the NYT project is to add a very thin border around those white pop-ups that appear when you hover, so that they stand apart a bit from the white background of the slide.
Thanks again - both projects are really neat.
Jill I hear ya ..I will follow you and create a demo too!..when the work madness has settled down. I really liked what you did here. The NYT hover is sexy but of little use..but I liked both experiences! They are so darn close- congrats! I was captivated by the next and previous arrows -hmm will have to peep under the cover to check those variables out! BTW your hubbie's artwork is lovely!!! I love the shameless plugs
Thanks everyone for your great feedback. I plan to keep making more demos because it's such a great way to try out new skills and build a library of templates.
@ Jeanette - I actually thought of adding a border to the hover states - but I was trying to make it look exactly like the NYT piece so I resisted the urge to improve the design. I saved that for my version If I were to make the NYT piece into a blank template, I would definitely add that border!!
This looks great, Jill!
I remember that interaction making the rounds last year. You did a great job recreating it. I'd be interested in seeing a Screenr on how you set up the Previous/Next counter.
Well done!
How would you have done it? Ditch the rollovers? Or put something different in them?
I agree they don't add anything.
They do tell you who the person in the image is, but there is a lot of wasted of space and could be condensed into a smaller rollover.
@ David - I will work on a screenr. If I were to redesign the NYT piece, I would have made the hover boxes smaller and added some kind of border like Jeanette suggested. For hover content, I would have included a summary of that person's comments in order to help readers decide whether they want to click on the picture and read the rest. If the hovers still looked bad, I would eliminate them.
I was also wondering if anyone can tell me how to go about embedding a published SL file in the middle of a webpage that has other content like the NYT piece? Would it be best to insert a thumbnail image then launch it in a lightbox? What other ways can you suggest?
I think if the original NYT design put the picture on the left and had the rollover expand toward the right it would look better since it wouldn't cover up so much of the focused space. Also a 1 pixel stroke and a drop shadow make it look nicer imo.
Nice, nice, nice . . .
Reminds me of something i was looking at yesterday. I just upgraded to the latest version of Xara Designer Pro X and was reviewing some of their new Photo and Content Widgets for inspiration. Got me to thinking, if I wanted to use one in a course, would I create it native in Storyline or create in Xara and use as a web object in Storyline.
Good to know how much we can do in Storyline itself . . . .
This discussion is closed. You can start a new discussion or contact Articulate Support.