[ un desarrollo de PATAGONIA CREATIVE ]

Archivos en Categoria: Fotografia

  • PicMarkr, Agregar marcas de agua a tus imágenes de forma online

    picmarkr.jpg

    Si acostumbras a ver por la red como roban las imágenes de tus post, enlazando directamente cada una de ellas, agregar una marca de agua puede ser en ocasiones una opción a tener en cuenta. PicMarkr es una sencilla aplicación que nos permite en simples pasos agregar marcas de agua a nuestras imágenes y todo de forma online, lo que significa que evitaremos tener que usar algún editor para realizar este tipo de efectos, y en el peor de lo casos tener que instalar otra nueva aplicación en nuestro ordenador. PicMarkr es tan sencillo como subir una imagen desde nuestro ordenador, o bien interactuando con nuestras imágenes almacenadas en Flickr, ya que PicMarkr inclusive nos permite realizar esto. Luego elegiremos la posición donde deseamos acomodar esa pequeña marca de agua, y el texto a mostrar. Inclusive encontraremos otros efectos mas haya de las marcas de aguas, por ultimo solo resta descargar. PicMarkr sin duda alguna, a mas de uno de ustedes le será útil, empezando por hacernos ahorrar tiempo, porque es fácil y rápido.

    Enlace PicMarkr

    via wwwhatsnew

  • Wallpapermaker, Diseñar wallpapers en segundos

    wallmakers.jpg

    Wallpapermaker es una sencilla aplicación online que nos permite crear wallpapers o fondos de escritorio personalizados. Para ello nos brinda una serie de fondos muy agradables a los cuales podremos agregarles figuras y accesorios extras. El único punto en contra por el momento, es que no nos permite subir una imagen de nuestro ordenador, pero fuera de ello, podremos crear fondos muy bonitos jugando con las combinaciones que el servicio nos ofrece. Además podremos utilizar una serie de herramientas como borrar si deseamos sacar algo en el diseño que vamos armando, rotar algunos objetos, etc. Si están un poco aburridos, crear wallpapers para sus ordenadores, sin duda, les hará pasar un poco el tiempo.

    Enlace Wallpapermaker

    Fuente wwwhatsnew

  • Estampillas con CSS

    estampillascss.jpg

    Una practica técnica para crear mediante CSS una especia de estampillas con nuestras imágenes. No se que tan útil podrá ser para tus proyectos, pero quien sabe, por ahí en el futuro sientas deseos de utilizarlo en alguna sección. Todo sirve, todo sirve.
    Ver demo
    Nuestro CSS

    CSS:
    .estampilla{
      border:5px dotted #fff !important;
      padding:4px;
      background:#ccc !important;
     border:5px dashed #ccc;
    }

    Uso: Simplemente agregamos la clase estampilla a nuestras imágenes

    HTML:
    <img alt="tip" class="estampilla" src="imagen.jpg">

  • Pictomio, Organizador y visualizador 3D de imágenes para tu ordenador

    Si en nuestro ordenador poseemos cantidad y cantidad de fotografías, nunca esta de más tener a mano algún programita extra para gestionarlas. Pictomio es una aplicación gratuita que se suma a otras diseñadas para este fin. Con el podremos organizar la cantidad de imágenes que tenemos en nuestro ordenador a medida que podremos ir archivando cada una de ellas. Inclusive nos permitirá mirar todas nuestras fotos mediante Slideshows. Lo extraordinario en este ultimo caso, los Slideshows, es que Pictomio utiliza técnicas y efectos incorporadas en tarjetas graficas, lo que permite conseguir Slideshows 3D realmente maravillosos.

    Enlace Pictomio

    Via visualbeta

  • Panel gallery – Una bonita forma de mostrar nuestras imágenes

    pgallery.jpg

    Panel gallery nos ofrece una opción muy agradable para presentar nuestras imágenes. No se si cuanto a diseño, pero si en cuanto a originalidad. Panel gallery nos permite crear una especia de galería mediante paneles, al estilo de miniaturas. Salvo que con ella en vez de dar un click sobre una imagen y mostrarla a una resolución mayor, navegaremos sobre cada panel con nuestro Mouse, deslizándonos de un lado a otro de la imagen y visualizando parte por parte de la misma, hasta haber conseguido visualizarla por completo o bien, cada detalle. No recuerdo como se llama este tipo de efecto ni tampoco si me explico bien. Pero mirando el demo sin duda entenderán lo que acabo de explicar.

    Ver demo - Descarga ejemplo

     

    En nuestro encabezado agregamos el script

    JavaScript:
    <script type="text/javascript">
    var xm = 0;
    var ym = 0;

    document.onmousemove = function(e){
        if (window.event) e=window.event;
        xm = e.clientX;
        ym = e.clientY;
    }

    var panel = {
        speed : .006,
        t : 0,
        O : [],
        over : false,

        run : function() {
            panel.t += panel.speed;
            for (var i = 0, o; o = panel.O[i]; i++)
                o.anim(i + panel.t);
        },

        init : function(){
            for (var i = 0, o; o = document.images[i]; i++){
                if (o.className.indexOf('panel')>= 0) {
                    if(o.parentNode.href != undefined) {
                        var div = document.createElement("a");
                        div.href = o.parentNode.href;
                    } else {
                        var div = document.createElement("div");
                    }
                    div.className = 'panel';
                    var img = document.createElement("img");
                    img.src = o.src;
                    img.className = 'imgPanel';
                    o.parentNode.replaceChild(div,o);
                    div.appendChild(img);
                    div.ims = img.style;
                    div.iw = img.width;
                    div.ih = img.height;
                    div.cx = -div.iw / 2;
                    div.cy = -div.ih / 2;
                    div.anim = function(t) {
                        nw = this.offsetWidth;
                        nh = this.offsetHeight;
                        if (panel.over == this){
                            for (var nx = 0, ny = 0, o = this; o != null; o = o.offsetParent) nx += o.offsetLeft, ny += o.offsetTop;
                            var x = Math.max(-this.iw + nw, Math.min(0, (-(xm - nx) * (this.iw - nw)) / nw));
                            var y = Math.max(-this.ih + nh, Math.min(0, (-(ym - ny) * (this.ih - nh)) / nh));
                            if (Math.abs(xm-nx-nw * .5)> nw || Math.abs(ym-ny-nh * .5)> nw ) panel.over = false;
                        } else {
                            var mx = (this.iw - nw) * .5;
                            var my = (this.ih - nh) * .5;
                            var x = -mx * (1 + Math.cos(t * 1.2));
                            var y = -my * (1 + Math.sin(t));
                        }
                        this.cx += (x - this.cx) * .1;
                        this.cy += (y - this.cy) * .1;
                        this.ims.left = Math.round(this.cx) + 'px';
                        this.ims.top  = Math.round(this.cy) + 'px';
                    }

                    div.onmouseover = function()
                    {
                        panel.over = this;
                    }
                    this.O.push(div);
                }
            }
            setInterval(panel.run, 32);
        }
    }

    onload = function ()
    {
        panel.init();
    }

    </script>

    un poco de CSS

    CSS:
    <style type="text/css">

        #screen {
            position: absolute;
            left: 22%;
            top: 20%;
            width: 60%;
            height: 60%;
            background: #fff;
            overflow: hidden;
        }
        .panel {
            position: relative;
            float: left;
            width: 21%;
            height: 30%;
            margin: 1%;
            overflow: hidden;
        }
        .imgPanel {
            position: absolute;
            border: none;
            text-decoration: none;
        }

    </style>

    Por ultimo nuestra estructura

    HTML:
    <div id="screen">

                <img class="panel" src="images/fl01.jpg" alt="">

        <img class="panel" src="images/slide110.jpg" alt="">
        <img class="panel" src="images/fl01.jpg" alt="">
                <img class="panel" src="images/fl01.jpg" alt="">

       

    </div>

  • MooFlow – Galeria basada en Javascript con aspecto a iTunes de Apple

    mooflow.jpg

    MooFlow. un extraordinario script desarrollado bajo MooTools que nos permitirá crear una galería de imágenes con un aspecto muy agradable. MooFlow posee varias características a favor, una de ellas lo ligero que es, pero lo mas agradable o mejor dicho lo que llamara muy rápido la atención de nuestros ojos, son los bonitos efectos de transición y la forma de visualizar cada una de las imágenes de nuestra galería, Similar en apariencia a iTunes de Apple o Finders CoverFlow. Es compatible con Safari, internet explorer 6 y 7, Firefox (and its mozilla friends), Opera y Camino. Coverflow sin duda es una buena opción para tus proyectos.

    Ver demo - Descarga MooFlow Demo Oficial

    Instalacion:

    Descargamos los script: MooFlow.js y mootools.

    Los alojamos en nuestro servidor o en la carpeta deseada y realizamos la llamada a ellos, copiando y pegando el siguiente código dentro de nuestra etiqueta < Head >

    JavaScript:
    <script type="text/javascript" src="mootools-beta-1.2b1.js"></script>
    <script type="text/javascript" src="MooFlow.js"></script>
    <script type="text/javascript">
    //<![CDATA[
    /* MooFlow */
    var mf;
    window.addEvent('load', function(){
        mf = new MooFlow({
            container: 'MooFlow',
            imgContainer: 'images',
            images: '#images img',
            caption: 'captions'
        });
    });
    //]]>
    </script>

    Contenido o estructura de nuestra galería

    HTML:
    <div id="MooFlow">
      <div id="images">
        <img src="foto1.jpg" alt="01" title="Esta es mi foto 1" />
        <img src="foto2.jpg" alt="01" title="Esta es mi foto 2" />
        <img src="foto3.jpg" alt="01" title="Esta es mi foto 3" />
        ....etc
      </div>
      <div id="captions"></div>
    </div>

    Fuentes Anieto2k | freakgroup

  • RoundPic – Redondear esquinas de tus imágenes de forma online

    RoundPic una bonita aplicación online que de forma realmente muy fácil nos permitirá redondear las esquinas de nuestras imágenes. Su utilización es muy sencilla. Para comenzar simplemente subiremos una imagen desde nuestro ordenador o bien introduciendo la URL de alguna que ya se encuentre online. Una vez que subimos la imagen RoundPic automáticamente generara el efecto. Pero también podremos configurar por nosotros mismos el nivel de curvatura que deseamos tenga la imagen, también el color de fondo deseado, como así también el tamaño y el nivel de calidad. RoundPic sin duda te será muy útil, solo deberás recordarlo cada vez que sientas deseos de dar este tipo de efecto a tus imágenes.

    Enlace RoundPic

    Fuente wwwhatsnew


Pagina 3 de 6«123456»