Mary Lou

ML is a freelance web designer and developer with a passion for interaction design. She studied Cognitive Science and Computational Logic and has a weakness for the smell of freshly ground peppercorns.

Website: http://www.codrops.com

Manoela's Articles (440)

Inspiration for Text Styles and Hover Effects

In Playground May 13, 2015 45 Comments

A couple of creative text styles and hover effects for your inspiration. Some effects use experimental techniques including SVG masking and Canvas.... read more

Photography Website Concept

In Playground May 6, 2015 40 Comments

A photography-inspired website layout with an expanding stack slider and a background image tilt effect.... read more

Interactive Drag and Drop Coloring Concept

In Playground April 22, 2015 64 Comments

A little fun experiment where you can color a website mockup by dragging and dropping a color droplet from a palette.... read more

Grid Item Animation Layout

In Playground April 15, 2015 80 Comments

A responsive, magazine-like website layout with a grid item animation effect that happens when opening the content.... read more

Some More Inspiration for Text Input Effects

In News & Updates March 18, 2015 28 Comments

A couple of more inspirational styles for text input effects including some new techniques and ideas.... read more

Playful Trampoline Effect

In Tutorials March 4, 2015 23 Comments

A little playful content navigation effect that uses the draggable Elastic Stack and Snap.svg for animating a background shape like a trampoline. The demos are a tri... read more

Inspiration for Button Styles and Effects

In Playground February 26, 2015 35 Comments

A collection of fresh button styles and effects for your inspiration. We use CSS transitions and pseudo-elements for most of the effects.... read more

Subtle Click Feedback Effects

In Playground February 11, 2015 48 Comments

A set of subtle effects for click or touch interactions inspired by the visualization of screen taps in mobile app showcases. The effects are done with CSS animation... read more

Some Ideas for Checkout Effects

In Playground January 22, 2015 31 Comments

Some fun effect and layout ideas for the first step of a checkout process in an online store. We are using the morphing buttons concept together with CSS transforms ... read more

Inspiration for Text Input Effects

In Playground January 8, 2015 90 Comments

Some inspiration for effects on text inputs using CSS transitions, animations and pseudo-elements.... read more

A Look Back at 2014: Round-up of Codrops Resources

In News & Updates December 30, 2014 45 Comments

A look back at the previous year with a summary of Codrops resources. Thank you all for supporting us!... read more

Sliding Header Layout

In Tutorials December 23, 2014 63 Comments

A tutorial on how to create a simple layout with a fullscreen header that slides up to reveal a content area with an image grid. ... read more

Elastic SVG Elements

In Playground December 15, 2014 38 Comments

Some inspiration for elastic components with SVG shape animations for enhanced UI interactions.... read more

Perspective Mockup Slideshow

In Playground November 21, 2014 47 Comments

An animated perspective mockup slideshow with 3D transforms based on the computations made with the help of Franklin Ta's script.... read more

Drag and Drop Interaction Ideas

In Playground November 11, 2014 74 Comments

Some ideas for drag and drop interactions in a UI. The idea is to show a droppable area that stands for certain actions after an element is being dragged.... read more

Simple Morphing Search

In Playground November 4, 2014 44 Comments

A simple effect idea for a search input that morphs into a fullscreen overlay. The idea is to enlarge the search input and show some relevant content or search resul... read more

Some More Subtle Hover Effect Ideas

In News & Updates October 28, 2014 51 Comments

A second set of styles was added to the collection of subtle hover effect ideas. The old set was updated and we've added some fresh effects with various transitions.... read more

Wobbly Slideshow Effect

In Playground October 24, 2014 34 Comments

The slides in this slideshow wobble as they move. The effect is based on Sergey Valiukh's Dribbble shot and was made using Snap.svg and morphing SVG paths.... read more

Tab Styles Inspiration

In Playground September 2, 2014 79 Comments

A couple of modern and subtle tab styles and effects for your inspiration. We use pseudo-elements, SVGs and CSS transitions for some of the techniques.... read more

Page Preloading Effect

In Tutorials August 5, 2014 103 Comments

A tutorial on how to re-create the page preloading effect seen on the website of Fontface Ninja. We are going to use CSS animations, 3D transforms and SVGs.... read more

Fullscreen Form Interface

In Playground July 30, 2014 149 Comments

An experimental fullscreen form concept where the idea is to allow distraction-free form filling with some fancy animations when moving between form fields. ... read more

Page 5 of 17
<
1
2
3
4
5
6
7
8
9
10
...
17
>

Would you like to write for Codrops?

We are always searching for creative and bold minds that have extraordinary ideas and are happy to try out new things related to web design and web development. Become part of an amazing group of contributors and authors and start writing for us.

Get in touch with us and tell us what makes you crazy and innovative enough to join the Codrops team.