{"id":20705011,"url":"https://github.com/andrearufo/prototysite","last_synced_at":"2025-10-04T18:59:24.246Z","repository":{"id":8874594,"uuid":"10589473","full_name":"andrearufo/PrototySite","owner":"andrearufo","description":"PrototySite Script for visualize images into a webpages and more","archived":false,"fork":false,"pushed_at":"2017-12-29T11:37:04.000Z","size":4504,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-11T08:04:52.088Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/andrearufo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-06-09T21:29:25.000Z","updated_at":"2017-12-29T11:37:05.000Z","dependencies_parsed_at":"2022-08-28T04:52:07.849Z","dependency_job_id":null,"html_url":"https://github.com/andrearufo/PrototySite","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/andrearufo/PrototySite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andrearufo%2FPrototySite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andrearufo%2FPrototySite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andrearufo%2FPrototySite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andrearufo%2FPrototySite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/andrearufo","download_url":"https://codeload.github.com/andrearufo/PrototySite/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/andrearufo%2FPrototySite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278358483,"owners_count":25973949,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-04T02:00:05.491Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-17T01:15:41.713Z","updated_at":"2025-10-04T18:59:23.992Z","avatar_url":"https://github.com/andrearufo.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# PrototySite\n\nPrototySite è uno script in PHP e JavaScript, realizzato da [Andrea Rufo](http://www.orangedropdesign.com/ \"Orange Drop Design\"), che permette una semplice e veloce visualizzazione dei prototipi  di siti web realizzati come immagini jpeg o png.\n\nQuesto progetto è dedicato in particolar modo ai grafici con poche competenze di programmazione per una veloce visualizzazione dei prototipi dei loro siti web via internet. Lo scopo è quello di mostrare, nella maniera più veritiera possibile, come realmente appare una grafica all'interno di un browser.\n\nDalla URL lo script richiama l'immagine e imposta la pagina delle giuste dimensioni per visualizzare centrata e della giusta lunghezza l'immagine voluta che ha la parvenza di essere un sito web all'interno del browser. Questo per fare in modo che un cliente la visualizza delle giuste proporzioni sullo schermo e delle giuste dimensioni per ogni risoluzione.\n\nPer informazioni o contatti: orangedropdesign@gmail.com\n\nSonnino, 9 giu 2013 23:40\n\n## Demo\n\nPotete visualizzare una demo di come opera lo script con diverse immagini su [http://dev.orangedropdesign.com/PrototySite/](http://dev.orangedropdesign.com/PrototySite/ \"Orange Drop Design Dev, Demo di PrototySite\").\n\n## Come funziona\n\nIn pratica lo script visualizza una immagine all'interno di una pagina web e, grazie a un po' di programmazione, imposta automaticamente tutta una serie di parametri per poter permettere una corretta visualizzazione. \n\nCliccando ovunque nella pagina poi, sarà possibile avere __l'elenco completo delle immagini realizzate__ e quindi passare a un'altra visualizzazione.\n\nLo script si riduce tutto a pochi file: in particolare a index.php che è il primo file che viene richiamato quando si digita un indirizzo web.\n\n## Installazione\n\n* Create il layout in Photoshop ed esportate in JPEG o PNG (si consiglia una larghezza di __1920px__ per una corretta visualizzazione sugli schermi più grandi);\n* Salvate tutte le vostre immagini prototipo in una cartella dello script (per esempio in 'images/');\n* Aprite la pagina __index.php__ e configurate i parametri (leggi sotto);\n* Caricate tutti i file del progetto (index.php; assets/ e images/) sul vostro spazio web via FTP;\n* Andate sul browser e digitate l'indirizzo del sito.\n\n## Configurazione\n\nLa configurazione non è necessariamente obbligatoria ma ho stabilito alcune variabili che possono risultare utili\n\n### File index.php\n\nSi possono configurare 4 variabili:\n\n* __$root__: indica la cartella con le immagini della demo (es. 'images/').\n* __$start__: è l'immagine di partenza; se non impostata parte dalla prima che viene trovata nella cartella specificata in $root.\n* __$bgcol__: indica il colore di sfondo della pagina; se non impostato è bianco. Risulta utile nel caso la grafica fosse più corta dello schermo dell'utente o nel caso non coprisse tutte l'area visualizzata.\n* __$title__: imposta titolo della pagina\n\n## Versioni\n\n### ver. 0.1 \n\nScript di visualizzazione con gestione manuale dell'indirizzo web\n\n### ver. 1.0\n\nPrima release pubblica con elenco immagini e link automatici a tutta pagina\n\n### ver. 1.1\n\nCorrezzione di alcuni bug nella selezione delle immagini e nell'automatizzazione della visualizzazione\n\n### ver. 1.2\n\nCreazione di una barra di utilità invece della lista a tutta pagina\n\n### ver. 1.3\n\nMiglioramento della barra e creazione delle funzioni per la gestiona della navigazion\n\n### ver. 1.3.1\n\nNuovi strumenti nella barra, bugfix delle animazioni e bugfix delle funzioni di controllo dell'eistenza immagine. Impendita la ripetizione dello sfondo del contenitore principale (fastidioso per i layout dalla larghezza ridotta).\n\n## Sviluppi futuri\n\n* Form per il caricamento di una nuova immagine direttamente dalla pagina web\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandrearufo%2Fprototysite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fandrearufo%2Fprototysite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandrearufo%2Fprototysite/lists"}