Hello%21%20I%27m%20Josh%2C%20a%20multidisciplinary%20designer/maker%20based%20out%20of%20Atlanta%2C%20GA%2C%20and%20I%27m%20just%20trying%20to%20figure%20this%20whole%20%27web%27%20thing%20out.
joshwork has 120 followers on Webflow.
.gif)
Portfolio%202.0%20-%20Joshwork%20by%20Josh%20Jacobs
%22Digital%20design%20is%20like%20painting%2C%20except%20the%20paint%20never%20dries.%22%0A-Neville%20Brody%0A%0ANew%20day%2C%20new%20portfolio%20site%2C%20if%20for%20no%20other%20reason%20than%20because%20messing%20around%20in%20Webflow%20is%20far%20too%20enjoyable%2C%20and%20my%20aesthetic%20has%20changed%20dramatically.%20Let%20me%20know%20what%20you%20think%20in%20the%20comments.%0A%0AFor%20reference%2C%20see%20my%20old%20site%20here%3A%20https%3A//joshwork.webflow.io/
Tags:
- portfolio
- cms
- webflow
- joshwork
- art%20director
- interactions
- interactions2
- hover
- mouseover
- scroll
Visit Site
Rad%20Mouse%20Movement%20Hero%21%20-%20Joshwork%20Dribbble%20series%20ft.%20UI8
Saw%20this%20cool%20interaction%20by%20UI8%20on%20Dribbble%20and%20had%20to%20try%20and%20recreate%20it%21%20I%20liked%20this%20concept%20as%20a%20hero%20space%2C%20so%20I%20added%20a%20modern%20nav%20to%20it%20that%20goes%20vertical%20on%20MVP%20to%20compliment%20the%20space.%20Let%20me%20know%20what%20you%20think%20in%20the%20comments%2C%20and%20clone%20away%21%0A%0ADesign%20credit%3A%20%22Call%20to%20Action%22%20by%20Anton%20Tkachev%20for%20UI8%20%28https%3A//dribbble.com/shots/6479771-Qaitomo-Call-To-Action%29%2C
Tags:
- hero
- interactions
- dribbble
- joshwork
- mouseover
- movement
- smooth
- menu
- vertical
- vertical%20nav
Visit Site
Predictive%20Text%20Form%21
As%20part%20of%20a%20freelance%20project%20I%27ve%20been%20working%20on%2C%20one%20of%20the%20requirements%20was%20a%20form%20field%20which%20would%20%22predict%22%20what%20the%20user%20was%20typing.%20It%20took%20me%20a%20while%20to%20find%20this%20solution%2C%20but%20once%20I%20found%20it%20and%20implemented%20it%20was%20super%20simple%2C%20and%20so%20I%20thought%20I%27d%20share%20it%20with%20the%20community%21%0A%0AInstructions%20/%20how%20to%27s%20are%20in%20the%20section%20below.%20Enjoy%2C%20and%20let%20me%20know%20what%20you%20think%21
Tags:
- forms
- formfields
- predictive
- responsive
- uiux
- form
- formblock
- joshwork
Visit Site
NEW%20Slider%20Interactions%21%20-%20Dribbble%20Series%20Ft.%20M%20S%20Brar
Wanted%20to%20play%20around%20with%20the%20new%20interaction%20types%20in%20IX2%2C%20and%20as%20always%20got%20a%20little%20carried%20away.%20All%20the%20design%20credit%20goes%20to%20M%20S%20Brar%27s%20%22Capture%20Moments%22%20%28https%3A//dribbble.com/shots/6291284-Capture-Moments%29%2C%20which%20I%20tasked%20myself%20with%20building%20as%20reference.%20Really%20happy%20with%20how%20it%20came%20out.%0A%0APeep%20the%20microinteractions%20on%20the%20menu%20button%20and%20the%20funky%20scroll%20indicator%20%28which%20changes%20to%20reflect%20the%20device%20type%20you%27re%20on%20%uD83D%uDE0D%29.%0A%0ALemme%20know%20what%20you%20think%20in%20the%20comments%21
Tags:
- webflowslider
- slider
- microinteraction
- microinteractions
- scroll
- scrollindicator
- menu
- menubutton
- search
- joshwork
- dribbble
Visit Site
Related%20Posts%20Section%20w/%20Horizontal%20Sticky
I%20had%20a%20dilemma%20on%20a%20recent%20project%3B%20my%20%22related%20posts%22%20section%20was%203000%20pixels%20long%20because%20all%20the%20sections%20were%20stacked%20horizontally.%20It%20was%20a%20mess.%20So%20I%20decided%20I%27d%20try%20something%20more%20horizontal%3B%20the%20problem%20was%2C%20my%20titles%20were%20going%20all%20over%20the%20place%2C%20and%20sliders%20weren%27t%20giving%20me%20the%20flexibility%20I%20was%20looking%20for.%0A%0AThank%20the%20lord%20for%20position%3A%20sticky%21%20using%20this%20horizontally%2C%20as%20opposed%20to%20in%20standard%20vertical%20fashion%2C%20I%20was%20able%20to%20solve%20for%20my%20problem%2C%20to%20much%20fanfare.%20See%20it%20live%20at%20the%20link%20below%2C%20clone%20away%2C%20and%20let%20me%20know%20what%20you%20think%20about%20this%20elegantly%20simple%20solution%21%0A%0Ahttps%3A//prelogin.zentail.com/blog/product-discovery-happens-on-search-google-shopping-actions%0A%0A***To%20make%20this%20work%20right%2C%20you%27ll%20need%20to%20undo%20all%20the%20CMS%20bindings.%20I%27ve%20updated%20the%20Webflow%20document%20with%20a%20second%20page%20that%20has%20the%20same%20elements%2C%20just%20not%20connected%20to%20anything.%20Copy%20that%20one%21
Tags:
- blog
- cms
- related
- particles
- sticky
- webflowsticky
- joshwork
- uxui
Visit Site
CSS%20GRID%20HERO%202%20-%20Dribbble%20Series%20-%20web%20design%2004%20-%20Photo%20Studio
Welcome%20to%20Dribbble%20series%2C%20where%20I%20attempt%20to%20bring%20to%20life%20projects%20created%20by%20popular%20Dribble%20artists%20using%20only%20the%20elements%20supplied%20by%20Webflow%21%20Todays%20project%20is%20web%20design%2004%20-%20Photo%20Studio%20by%20Romeo%20M.%20%u2022%20https%3A//dribbble.com/shots/5593011-web-design-04-Photo-Studio%0A%0AIn%20my%20freelancing%20using%20Webflow%2C%2095%25%20of%20my%20work%20involves%20creating%20crazy%2C%20weird%20sliders%20that%20accomplish%20certain%20goals.%20This%20project%20is%20peak%20slider%3B%20displaying%20information%2C%20using%20grid%2C%20with%20customizations%20applied%20to%20the%20snide%20nav%2C%20arrows%2C%20%26%20content.%0A%0AFor%20this%20project%2C%20I%20opted%20to%20change%20a%20few%20things%20that%20didn%27t%20make%20sense.%20For%20example%2C%20there%20were%203%20different%20places%20in%20the%20page%20where%20social%20links%20were%20listed%2C%20which%20felt%20like%20overkill.%20I%20also%20nixed%20the%20mouse%20icon%20in%20the%20prev/next%20section%2C%20as%20the%20slider%20doesn%27t%20let%20you%20interact%20like%20that.%20Clone%20away%2C%20and%20let%20me%20know%20what%20you%20think%20in%20the%20comments%21%20Be%20sure%20to%20download%20the%20Fontawesome%20font%20family%20to%20make%20sure%20the%20icons%20work%20%28https%3A//fontawesome.com/cheatsheet%29
Tags:
- css
- cssgrid
- joshwork
- dribbble
- hero
- interactions
- interactions2
- responsive
- mobile
- trendy
Visit Site
Trendy%20Search%20Interaction%20-%20022%20%u2022%A0Search%20by%20Clara%20Boyle%20-%20Joshwork%20Dribbble%20Series
Welcome%20to%20Dribbble%20series%2C%20a%20new%20effort%20in%20which%20I%20attempt%20to%20bring%20to%20life%20interactions%20created%20by%20popular%20Dribble%20artists%20using%20only%20the%20elements%20supplied%20by%20Webflow%21%20Today%27s%20project%20is%20based%20on%20022%20%u2022%20Search%20by%20user%20Clara%20Boyle%20%28https%3A//dribbble.com/shots/5355680-022-Search%29%0A%0AMicrointeractions%20are%20not%20only%20trendy%2C%20but%20a%20vital%20piece%20of%20user%20experience%20in%202018.%20Here%27s%20a%20simple%2C%20effective%20way%20to%20minimize%20and%20maximize%20a%20critical%20element%20of%20your%20site%2C%20the%20search%20function.%20with%20a%20simple%20click%2C%20the%20icon%20representing%20the%20action%20becomes%20the%20button%20for%20the%20action%20itself.%20Simple%2C%20easy%2C%20and%20intuitive.%20Clone%20away%21
Tags:
- search
- microinteractions
- cloneable
- cloned
- joshwork
- webflowcms
- interactions2
- interaction
- microinteraction
Visit Site
Fancy%20Hide/Show%20Menu%20on%20Scroll
One%20of%20my%20favorite%20modern%20web%20effects%20is%20when%20a%20menu%20hides%20on%20scroll%20down%20and%20reveals%20on%20scroll%20up.%20Most%20mobile%20web%20browsers%20like%20Google%20Chrome%20do%20this%20for%20their%20top%20menus%2C%20and%20for%20good%20reason%3B%20moving%20these%20elements%20out%20of%20the%20way%20of%20the%20user%20allows%20the%20page%20content%20to%20reign%20supreme.%0A%0AI%20use%20this%20effect%20on%20my%20personal%20site%2C%20and%20now%20so%20can%20you%21%20You%20can%20also%20customize%20the%20delay%20or%20offset%20to%20whenever%20you%27d%20like%20the%20menu%20to%20start%20disappearing%20or%20reappearing.%20Don%27t%20forget%20to%20like%2C%20comment%2C%20and%20clone%20away%21
Tags:
- webflow
- menu
- navbar
- uiux
- clone
- cloneable
- joshwork
- scroll
- scrollable
- animation
- interactions
- interaction
- interactions2
Visit Site
CSS%20GRID%20HERO%20-%20S.M.A.T%20Lab%20/%20True%20AI%20-%20Joshwork%20Dribbble%20Series
Welcome%20to%20Dribbble%20series%2C%20a%20new%20effort%20in%20which%20I%20attempt%20to%20bring%20to%20life%20interactions%20created%20by%20popular%20Dribble%20artists%20using%20only%20the%20elements%20supplied%20by%20Webflow%21%20Todays%20project%20is%20S.M.A.T%20Lab%20/%20True%20AI%20by%20user%20Mike%20%7C%20https%3A//dribbble.com/shots/5430800-S-M-A-T-Lab-True-AI%29.%0A%0ASimply%20click%20a%20column%20and%20see%20the%20content%20change%20before%20your%20eyes%21%20I%27m%20a%20huge%20fan%20of%20how%20this%20turned%20out%2C%20on%20all%20viewports.%20And%20best%20of%20all%2C%20I%20got%20a%20wonderful%20excuse%20to%20test%20out%20CSS%20Grid.%20Clone%20away%2C%20and%20let%20me%20know%20what%20you%20think%20in%20the%20columns%21
Tags:
- cssgrid
- grid
- columns
- dribbble
- webflow
- interactions
- interactions2
- cloneable
- joshwork
- responsive
- modern
- uiux
Visit Site
Circular%20Hover%20Effect%3A%20Buttons
Folks%20really%20seemed%20to%20enjoy%20my%20original%20Circular%20Hover%20Effects%20cloneable%20project%20%28https%3A//webflow.com/website/circular-hover%29%2C%20so%20I%20decided%20to%20turn%20it%20into%20a%20series.%20Next%20up%3A%20buttons%20with%20some%20fun%20circular%20hover%20effects%21%20Clone%20away%2C%20and%20let%20me%20know%20what%20you%20think%20in%20the%20comments%21
Tags:
- cloneable
- clone
- joshwork
- hover
- webflow
- circular
- interactions
- interactions2
- buttons
- states
- hover%20effects
- microinteractions
Visit Site
Headline%20Highlight%20+%20Display%20on%20Load/Scroll/Click
Hey%20everyone%21%20Just%20playing%20with%20some%20super%20simple%20headline%20highlight%20effects%2C%20and%20thought%20I%27d%20share%20them%20with%20you%21%20Enjoy%21
Tags:
- webflow
- headline
- hightlight
- interactions
- interactions2
- display
- cloneable
- clone
- joshwork
- click
- scroll
- loader
Visit Site
Page%20Indicator%20Exploration%20%5BOleg%20Frolov%5D%20-%20Joshwork%20Dribbble%20Series
Welcome%20to%20my%20Dribbble%20series%2C%20a%20new%20effort%20in%20which%20I%20attempt%20to%20bring%20to%20life%20interactions%20created%20by%20popular%20Dribble%20artists%20using%20only%20the%20elements%20supplied%20by%20Webflow%21%20Todays%20project%20is%20%22Page%20Indicator%20Exploration%22%20by%20user%20Oleg%20Frolov%20%28https%3A//dribbble.com/shots/5254763-Page-Indicator-Exploration%29.%20Kick%20back%2C%20relax%2C%20enjoy%20some%20smoothe%20indicators%2C%20and%20clone%20away%21%0A%0ADo%20you%20think%20I%20could%27ve%20done%20something%20different%20or%20better%3F%20I%27d%20love%20to%20hear%20your%20thoughts%20in%20the%20comments%21
Tags:
- loading
- interactions
- interactions2
- microinteractions
- webflow
- cloneable
- clone
- dribbble
- joshwork
- grid
- animation
- looping
Visit Site
Trendy%20Footer%20Reveal%21
One%20of%20my%20favorite%2C%20trendy%20interactions%20is%20a%20footer%20that%20reveals%20itself%20once%20the%20user%20gets%20to%20the%20bottom%20of%20the%20page.%20I%27ve%20used%20this%20effect%20a%20number%20of%20times%2C%20and%20thought%20I%27d%20share%20it%20with%20you%20%28trendy%20vertical%20nav%20included%29%21%20Enjoy%2C%20and%20clone%20away%21%0A%0AFor%20Cloners%3A%20Be%20sure%20to%20make%20the%20height%20of%20the%20section-footer-spacer%20to%20be%20the%20same%20as%20your%20footer%20height%20is%20for%20the%20reveal%20to%20work%21%20Or%2C%20if%20your%20footers%20height%20is%20content-based%2C%20duplicate%20the%20footer%20as%20you%20want%20it%2C%20rename%20it%2C%20and%20give%20it%20the%20following%20values%3A%20z-index%3A%200%2C%20opacity%3A%200%2C%20position%3A%20relative.%20That%20should%20solve%20any%20issues%20you%20might%20have%21
Tags:
- footer
- responsive
- interaction
- interactions
- reveal
- trendy
- clone
- cloneable
Visit Site
Active%20Menu%20Circular%20Transition
Welcome%20to%20another%20funky%20circular%20Webflow%20experiment%21%20This%20time%2C%20I%20use%20only%20Link%20Blocks%20%28no%20interactions%20necessary%29%20paired%20with%20SVGs%20to%20create%20a%20nifty%20little%20menu%20active%20state.%20Pairs%20nicely%20with%20the%20last%20circular%20cloneable%20project%20I%20made%20%3B%29%0A%0AClone%20away%2C%20Webflow-ers%21
Tags:
- circular
- active
- menu
- bottom
- free
- cloneable
- clone
- webflow
- interaction
- transitions
- color
- circles
Visit Site
Supplement%20CMS%20Imagery%20From%20Youtube%21
Hello%20everyone%21%20Today%27s%20fun%20experiment%3B%20using%20and%20implementing%20images%20straight%20from%20Youtube%20in%20tandem%20with%20Webflow%20CMS%20to%20better%20contextualize%20posts%21%0A%0AHow%27d%20I%20do%20it%2C%20you%20ask%3F%20Simple%21%20Custom%20code%2C%20mixed%20with%20Webflow%20CSS%2C%20in%20which%20is%20injected%20a%20background-image%20referencing%20the%20link%20for%20the%20HD%20youtube%20image%20from%20the%20post-specific%20youtube%20video.%0A%0AVery%20much%20a%20WIP.%20One%20thing%20I%20want%20to%20improve%20is%20the%20video%20experience%20on%20the%20posts%20page.%20I%20had%20to%20put%20the%20video%20in%20a%20lightbox%20because%2C%20on%20larger%20viewports%20where%20the%20video%20took%20over%20the%20whole%20hero%2C%20you%20couldn%27t%20scroll%20past%20the%20video%20because%20it%27s%20an%20iframe.%20I%27m%20currently%20searching%20for%20a%20better%20solution%20for%20this%20issue%2C%20so%20if%20you%20have%20one%20I%27d%20love%20to%20hear%20about%20it%20in%20the%20comments%21%0A%0ALet%20me%20know%20what%20you%20think%21%20All%20video%20links%20and%20images%20used%20in%20the%20project%20are%20credited%20to%20https%3A//www.theverge.com
Tags:
- cms
- youtube
- youtuber
- content
- blog
- stylish
- custom
- categories
- video
- videos
Visit Site