Photopea el Photoshop gratuito basado en web

Puede, no lo se, que Photoshop no sea el mejor programa de edición y modificación de imágenes, pero sin ninguna duda es el más popular, conocido y utilizado en todo el mundo.

Photopea es una utilidad web muy similar a Photoshop. De hecho, utiliza las mismas teclas rápidas que podemos utilizar en Photoshop para realizar las diferentes tareas. Si ya has utilizado Photoshop con anterioridad, no te costará nada desenvolverte en Photopea.

Como hemos dicho, Photopea es una aplicación web, la puedes utilizar desde tu navegador favorito. Este es el enlace a Photopea.

Puede que Photopea no sea un Photoshop completo, pero para la mayoría de usuarios, las herramientas que nos aporta esta aplicación web son más que suficientes para realizar las tareas habituales.

Con Photopea podrás seguir cualquier curso de Photoshop, y realizar esos pequeños retoques en tus fotografías, realizar practicas, ejercicios o cualquier otra actividad que necesites.

Una herramienta versátil, que no requiere de instalación en nuestro ordenador, no ocupa espacio en tu disco duro, se puede utilizar en cualquier ordenador, cómodamente desde tu navegador web favorito, alli donde te encuentres, y sorprendentemente, de momento, es gratuita.

Por defecto, la interfaz de Photopea, viene en ingles, pero si para ti esto es un problema, puedes cambiar la configuración del idioma a más de 30 lenguas diferentes, incluyendo el castellano (español).

Al seleccionar un proyecto nuevo, tienes multiples plantillas ya rediseñadas para realizar tus tareas. De tantas plantillas que hay, existe un buscador para que te resulte más fácil encontrar una que se adapte a la tarea que necesitas realizar.

También te permite seleccionar una gran variedad de tamaños recopilados en varios grupos; social, impresión, foto, pantalla, móvil, anuncios o iconos. Todos ellos disponibles con un solo click de ratón.

Photoshop, sin ninguna duda es una gran aplicación para crear y retocar imágenes, pero Photopea no se queda atrás, parece verdaderamente un clon de Photoshop.

Share

Personaliza tu Apple Watch con estas aplicaciones

Es evidente que ha la inmensa mayoría de las personas les gusta imprimir un diseño personal a su imagen. La forma de vestir o de peinarse refleja nuestra personalidad, nos diferencia del resto de humanos. No es de extrañar que también queramos llevar esta personalización a otros objetos que se han hecho cotidianos en nuestro entorno. Personalizar relojes y teléfonos inteligentes esta cada vez más en uso.

La última versión de watchOS, la versión 7, trae una importante característica que nos permite personalizar, aunque de forma limitada, las carátulas de nuestro reloj.

Una mejora que ha vuelto locos a muchos de los propietarios de este icónico reloj de Apple.

Por este motivo están apareciendo aplicaciones que comparten el diseño realizado por otros usuarios, para que cualquiera de nosotros personalicemos con estas esferas nuestro Apple Watch. Una analogía a nuestra forma de vestir, pero aquí vestimos a nuestro dispositivo, con las imágenes, formas y colores que nos sean más atractivos.

Una de estas aplicaciones es WatchFacely

Esta aplicación nos permite ver y descargar los diseños realizados por otros usuarios. Podemos realizar busquedas por usuario, tags, o ver los más populares, los añadidos recientemente o las colecciones. También podemos guardar nuestros favoritos para tenerlos siempre a mano.

Una vez seleccionada la esfera que nos gusta tan solo tendremos que pulsar en el botón “add Apple Watch Face“. Esta acción nos lleva a la aplicación “Watch“. Para añadir la esfera a nuestra colección pulsamos en “Añadir a mis esferas“, y ya estará disponible en nuestro reloj.

Esta nueva esfera la podemos personalizar aun más a nuestro gusto, cambiando colores, posiciones y complicaciones, desde la propia aplicación Watch.

Otra interesante aplicación es BuddyWatch. Esta aplicación quizas tenga diseños más elegantes, es solo cuestión de gustos.

Su funcionamiento es similar a la aplicacción anterior, navegamos por las diferentes caratulas que nos ofrece, cuando alguna nos gusta, tan solo debemos de pulsar en el botón “Download“, y seguir los pasos igual que en la aplicación anterior.

La aplicación también nos permite guardar las mejores caratulas para tenerlas siempre a mano. La esfera también nos ofrece información de las correas que mejor conbinan con dicha esfera.

Es verdad que los diseños ofrecidos por estas aplicaciones son bastante limitados, Apple no deja libertad absoluta para el diseño de las caratulas. Todos los diseños ofrecidos estan basados en la personalización de las caratulas ya existentes, pero el ingenio humano siempre nos puede sorprender, aun existiendo muchas limitaciones, se crean diseños muy atractivos y que ha nosotros no se nos hubieran ocurrido nunca.

Share

Añade un menú animado y colorido en tu pagina Web, en CSS

Es posible crear un menú animado muy vistoso para tu pagina web con un sencillo código CSS.

CSS nos permite dar formato a las paginas web, convertirlas en algo mucho más atractivo que lo que nos da el soso html. Es increíble la cantidad de posibilidades que nos ofrece CSS para crear un atractivo, colorido y dinámico menú.

Este ejemplo de menú esta diseñado para contener 5 elementos, pero fácilmente puede ser modificado, si necesitas un número de elementos mayor o menor.

Código de ejemplo html:

<nav>
    <a href="#">Inicio</a>
    <a href="#">Blog</a>
    <a href="#">Sitemap</a>
    <a href="#">Portafolio</a>
    <a href="#">Contact0</a>
    <div class="animation start-home"></div>
</nav>

Código CSS:

nav {
    margin: 27px auto 0;
    position: relative;
    width: 590px;
    height: 50px;
    background-color: #34495e;
    border-radius: 8px;
    font-size: 0;
    margin-top: 200px;
}

nav a {
    line-height: 50px;
    height: 100%;
    font-size: 15px;
    display: inline-block;
    position: relative;
    z-index: 1;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    color: white;
    cursor: pointer;
}

nav .animation {
    position: absolute;
    height: 100%;
    top: 0;
    z-index: 0;
    transition: all .5s ease 0s;
    border-radius: 8px;
}

a:nth-child(1) {
    width: 100px;
}

a:nth-child(2) {
    width: 110px;
}

a:nth-child(3) {
    width: 100px;
}

a:nth-child(4) {
    width: 160px;
}

a:nth-child(5) {
    width: 120px;
}

nav .start-home,
a:nth-child(1):hover~.animation {
    width: 100px;
    left: 0;
    background-color: #1abc9c;
}

nav .start-about,
a:nth-child(2):hover~.animation {
    width: 110px;
    left: 100px;
    background-color: #e74c3c;
}

nav .start-blog,
a:nth-child(3):hover~.animation {
    width: 100px;
    left: 210px;
    background-color: #3498db;
}

nav .start-portefolio,
a:nth-child(4):hover~.animation {
    width: 160px;
    left: 310px;
    background-color: #9b59b6;
}

nav .start-contact,
a:nth-child(5):hover~.animation {
    width: 120px;
    left: 470px;
    background-color: #e67e22;
}

body {
    font-size: 12px;
    font-family: sans-serif;
    background: #2c3e50;
}

span {
    color: #2BD6B4;
}

Da un aspecto elegante a tu menú con este llamativo ejemplo en CSS.

Share

Consigue un llamativo efecto en tus textos con CSS

Es increíble la cantidad de posibilidades que nos ofrece CSS para diseñar una pagina web, las posibilidades son casi infinitas, la imaginación es el único limite.

Con unas simples lineas en CSS podemos crear un llamativo rotulo tipo comic e incluirlo fácilmente en cualquier parte de una pagina web.

Código CSS

body {
  background-color: #fc3153;
  text-align: center;
}

h1 {
  font-size: 144pt;
  font-family: 'Luckiest Guy';
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-shadow:   0px -6px 0 #212121,  
                 0px -6px 0 #212121,
                 0px  6px 0 #212121,
                 0px  6px 0 #212121,
                -6px  0px 0 #212121,  
                 6px  0px 0 #212121,
                -6px  0px 0 #212121,
                 6px  0px 0 #212121,
                -6px -6px 0 #212121,  
                 6px -6px 0 #212121,
                -6px  6px 0 #212121,
                 6px  6px 0 #212121,
                -6px  18px 0 #212121,
                 0px  18px 0 #212121,
                 6px  18px 0 #212121,
                 0 19px 1px rgba(0,0,0,.1),
                 0 0 6px rgba(0,0,0,.1),
                 0 6px 3px rgba(0,0,0,.3),
                 0 12px 6px rgba(0,0,0,.2),
                 0 18px 18px rgba(0,0,0,.25),
                 0 24px 24px rgba(0,0,0,.2),
                 0 36px 36px rgba(0,0,0,.15);
}

De una forma realmente sencilla puedes tener tus titulares con un diseño personalizado.

Prueba tus diseños desde aquí.

Share

17 fuentes que pueden hacer más bello tu sitio web

Las fuentes tipográficas pueden dar un aspecto más personalizado a tu sitio web. Muchas personas no consideran la importancia de las fuentes en el diseño web, pero es fundamental para mostrar proyectos más frescos y modernos, llamativos y acordes al producto que queremos ofrecer.

Las siguientes fuentes son de código abierto, y realmente te encantarán.

Puede que alguna de estas fuentes sea lo que estas buscando para tu nuevo proyecto y le de esa apariencia que no sabias como conseguir.

Fuente tipografica Manrope

Share